Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #308812

    Hi,

    I bought your template and thank you very much for it, it is amazing and well made !

    I would like to do this :
    iconbox wanted
    But with AVIA and the item “iconbox” i can’t put a picture. I have seen on your forum as it possible to make a class and call it in iconbox configuration. But is there a way which i could put the picture from AVIA ?

    The green area represents the place of the picture.

    Thanks a lot for your help

    Regards,
    Matthieu

    • This topic was modified 10 years, 4 months ago by Josue.
    #309220

    Hey Matthieu!

    You’d need to use CSS for that, something like this in Quick CSS will do it (i’m supposing you set a custom class to the iconbox):

    .custom_class .iconbox_top:before {
        content: "";
        width: 100%;
        background: url(put_background_image_here) no-repeat center top;
        background-size: cover;
        height: 60px; /* change this for the height of your preference */
        position: absolute;
        top: -61px; /* change this for the height of your preference */
        left: 0;
    }
    
    /* Global */
    .iconbox_top {
        position: relative;
    }

    Regards,
    Josue

    #309485

    Hi Josue !

    Thank you very much for your answer, i tried but it’s not working in my website.

    I put your code in custom-css (and i tried too in Quick css) with an absolute url for my picture to be sure
    I called “iconbox_top” in AVIA in custom class of my iconbox

    Should I change .custom_class ? (by example something like that : .iconbox .iconbox_top:before { )
    Should i put something in content: “_here_?_”;

    Thanks a lot !

    Regards,
    Matthieu

    #309500

    Hey Matthieu!

    Can you post a link to the page where you are trying this?

    Remember that you need to enable this first and set a class of “custom_class” to the iconbox elements you want to affect.

    Best regards,
    Josue

    #309532

    Hi Josue,

    Thanks for your fast answer !

    I ever enable it, i use this AVIA function for other elements.
    I work in local, but could I upload it tomorrow when i go back to home.

    Just about my last questions, could i put the same script as you give me or have I to change other element than background link ?
    What “name” of class have I to put in AVIA custom class ? I tried with “iconbox_top”, is it that ?
    Should I put someting in “content” line of the script or i use like this with content: ” “; ?

    Again, thanks a lot !

    Best regards,
    Matthieu

    #309581

    Hey Matthieu!

    You can put whatever you want as the custom class, but what you put there must be the same declared in the code, example if i put something like “josue_iconbox”:

    .josue_iconbox .iconbox_top:before {
        content: "";
        width: 100%;
        background: url(put_background_image_here) no-repeat center top;
        background-size: cover;
        height: 60px; /* change this for the height of your preference */
        position: absolute;
        top: -61px; /* change this for the height of your preference */
        left: 0;
    }

    In the actual code properties the only thing you need to change is the background: url(..) and the height/top if needed.

    Cheers!
    Josue

    #310064
    This reply has been marked as private.
    #310085

    Hey!

    Try with this code:

    .josue_iconbox.iconbox_top:before {
        content: "";
        width: 100%;
        background: red;
        background-size: cover;
        height: 60px; /* change this for the height of your preference */
        position: absolute;
        top: -61px; /* change this for the height of your preference */
        left: 0;
    }
    

    Don’t forget to purge your caching/minification plugin.

    Best regards,
    Josue

    • This reply was modified 10 years, 4 months ago by Josue.
    #310125

    Thanks a lot Josue, you’re the best !

    :-)

    #310126

    You are welcome, glad to help :)

    Regards,
    Josue

    #310135
    This reply has been marked as private.
    #310138

    Done :)

Viewing 12 posts - 1 through 12 (of 12 total)
  • The topic ‘Iconbox + picture above’ is closed to new replies.