Tagged: , ,

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • August 25, 2014 at 1:51 pm #308812
    mattv7

    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, 3 months ago by Josue.
    August 26, 2014 at 9:54 am #309220
    Josue

    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

    August 26, 2014 at 7:25 pm #309485
    mattv7

    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

    August 26, 2014 at 8:02 pm #309500
    Josue

    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

    August 26, 2014 at 9:08 pm #309532
    mattv7

    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

    August 27, 2014 at 12:06 am #309581
    Josue

    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

    August 27, 2014 at 9:25 pm #310064
    mattv7
    This reply has been marked as private.
    August 27, 2014 at 11:14 pm #310085
    Josue

    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, 3 months ago by Josue.
    August 28, 2014 at 12:11 am #310125
    mattv7

    Thanks a lot Josue, you’re the best !

    :-)

    August 28, 2014 at 12:13 am #310126
    Josue

    You are welcome, glad to help :)

    Regards,
    Josue

    August 28, 2014 at 12:43 am #310135
    mattv7
    This reply has been marked as private.
    August 28, 2014 at 12:45 am #310138
    Josue

    Done :)

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