Forum has been created to help all our customers in properly working our theme. We offer complete help with configuration theme and make default look, just like on our Be|theme demo. We don`t offer theme customization.


Before creating a new discussion, please:
1. Check on forum if discussion hasn`t been created before. Use the forum Search on the right.
2. Read carefully the documentation included to package.
3. If you didn`t find what you need and would like to post a new question click the "Start a New Discussion" button on the right.
4. You can post on forum only after registration (you need purchase code to register) .


NOTE!!! If you are starting a new topic and have got problems with your site and you want us to check what`s wrong please always give url to your site because without that we can`t check what`s wrong. Each case may be different because of your installed plugins, servers or other things.


IMPORTANT!!! Along with your inquiry, please attach the address of the page which concerns the question. This will cause the time to answer on your question will be much shorter. If you do not want to publish your address publicly in the forum, please send a private message. Thanks!

Converting the featured image overlay from a "chain link" icon to an "->" arrow icon

Hi Muffin,

BACKGROUND:

for either hiding, or modifying the blue pop up on portfolio (and also category) images. By default, the pop-up has a magnifying glass icon (for zoom) and a chain-link icon (which links to the portfolio page or category page).

I'm using the CSS from that thread to hide the magnifying glass:

.image_frame .image_wrapper .image_links a.zoom { display: none !important; }
.image_frame .image_wrapper .image_links a.link { width: 100% !important; }

and that code is working great.

QUESTION:
My current question is how to now convert the "chain link" icon to be an arrow icon that points to the right. I'd love to use the muffin icon: "icon-right" for this. 

Is there a way, using CSS, to change that chain-link icon to be the icon-right icon?

Thanks!

Comments

  • Please sign in to see answear!
  • Hi Support,

    That's great - thanks. I'll email you the link with a reference to this thread. I know how to view the inspector but I'm not sure exactly which to enter in to your CSS. If you send me the selector info I can then view the code to figure out which you used and I'll be able to do it next time. Thanks again!
  • OK - here's the update. First, a big thank-you to the Muffin Support team. I'm a bit slow at this.

    However, with their help - here's what I found.

    The custom CSS to change the chain-link to be a right arrow is this:
    .icon-link:before{content:'\e911'}

    To find the icons I usually google "Betheme icons". I don't think I ever did find the actual Betheme icons, but I found these, and they generally seem to work: http://themes.muffingroup.com/cake/shortcodes/icons

    However, that gives the icon "Name", not the shortcode. To find the short code, go to /betheme/fonts/mfn-icons.css and view the source code for that. Search for the icon name and look for the numbers similar to the e911, or e8b1 - and that gives you the code to add as the CSS into the "Custom CSS" part of Betheme Options.

    Personally, in my Custom CSS I always try to put a comment explaining each tweak, so my full entry looks like this with the first line being the comment:

    //Changing the featured image chain link icon to be an arrow {}
    .icon-link:before{content:'\e911'}
  • Please sign in to see answear!
Sign In or Register to comment.