Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • November 17, 2013 at 4:25 am #189733
    hojoon

    Hello

    I would like to make images such as below link.

    http://themeforest.net/item/jarvis-onepage-parallax-wordpress-theme/full_screen_preview/5370691

    The second image of this website uses ‘pattern overlay’ by using css.

    Please let me know how to do like this on my enfold theme.
    I need detailed codes.

    Thanks in advance
    Hojoon

    November 18, 2013 at 2:59 am #189909
    Yigit

    Hey hojoon!

    You can add following code to Quick CSS in Enfold theme options under Styling tab to change arrow icon on hover state to any other content 

    .image-overlay.overlay-type-extern .image-overlay-inside:before {
content: 'Your custom text goes here';
font-family: 'entypo-fontello';
}

    You are going to need to hire a freelance developer for that kind of customization as it is beyond the scope of support we can provide. You can also request quote here.

    Cheers!
    Yigit

    November 19, 2013 at 6:55 pm #190689
    charlies23

    Hi!

    I want to change the mage hover arrow to this image:
    http://martongenetics.web-developer.hu/pictures/mg_logo.png

    I have tried adding the code above to the styles tab but it does not work. I was editing the base.css at the proper lines but it does nto work either.

    Enfold.css is overriding everything. I assume enfold.css is a generated sylesheet based on the selections I make in the wp admin panel.

    My experimental site is:
    http://martongenetics.web-developer.hu/

    Can you tell me exactly what file to edit and where to have the image i posted above instead of the arrow when i hover a picture?
    I am looking forward to hear from you!

    November 20, 2013 at 1:58 am #190768
    Ismael

    Hi!

    Place it on Enfold > Styling > Quick CSS or add it on your custom.css. It should override all of the css style if you’re using the correct selector.

    Cheers!
    Ismael

    January 11, 2014 at 9:43 am #208368
    jtree5757

    .image-overlay.overlay-type-extern .image-overlay-inside:before {
    content: ‘Your custom text goes here’;
    font-family: ‘entypo-fontello’;
    }

    Thanks for this Yigit!
    May I ask, How would I use a font icon? I know I can just type custom text here, but how canI add an icon from the default Entypo or from uploaded ones from fontello?
    An example would be nice so I can see the structure of the code.

    thanks!

  • Author
    Posts
Viewing 5 posts - 1 through 5 (of 5 total)
  • The topic ‘pattern overlay’ is closed to new replies.