Viewing 13 posts - 1 through 13 (of 13 total)
  • Author
    Posts
  • June 1, 2014 at 4:33 am #272913
    morpho2014

    Hello,

    Can I add an email button as envelope graphic and text ”send us a message’ under twitter in footer?

    Many thanks in advance,

    Tony

    June 1, 2014 at 7:29 pm #273007
    Josue

    Hey!

    Add a Text Widget with this content:

    [av_button label='send us a message' link='manually,http://kriesi.at' link_target='' color='theme-color' custom_bg='#444444' custom_font='#ffffff' size='small' position='center' icon_select='yes' icon='ue805' font='entypo-fontello' custom_class='']

    Change as needed.

    Best regards,
    Josue

    June 3, 2014 at 2:45 pm #273896
    morpho2014

    Hey Josue,

    Would this take people who click on it to my contact page?

    Please could you explain which parts of the code I would need to change? Unfortunately I don’t know anything about code…

    Many thanks for your excellent support.

    Best,

    Tony

    June 3, 2014 at 3:51 pm #273930
    Yigit

    Hi!

    Please change 

    http://kriesi.at

    to link to your contact page and it should work fine

    Regards,
    Yigit

    June 5, 2014 at 11:48 pm #275379
    morpho2014
    This reply has been marked as private.
    June 5, 2014 at 11:50 pm #275380
    Josue

    Hey!

    Try adding this code to the Quick CSS:

    #footer div#text-3 {
    position: absolute;
    top: 5px;
    left: 105px;
}

    Cheers! 
    Josue

    June 6, 2014 at 1:17 am #275393
    morpho2014

    Many thanks for your quick reply Josue!

    Sorry, I didn’t explain very well.

    Can I keep the email button in the line below the twitter, but have them both align to a common left margin?

    Also can I make the email button and text look like the twitter above? Obviously changing the twitter bird symbol to an envelope, and the symbol colour to the red (same red as the button ‘ask us how we can help you’?

    Best wishes,

    Neil

    June 6, 2014 at 1:28 am #275398
    Josue

    Try with this:

    #text-3 .avia-button-center {
    text-align: left;
}

#text-3 {
    margin-top: -20px !important;
}

#text-3 .avia-button {
    background: transparent;
    border: 0;
    padding: 0 !important;
}

#text-3 .avia-button .avia_iconbox_title{
    color: white;
    font-size: 11px !important;
}

#text-3 .avia_button_icon{
    padding: 5px 10px;
    color: white;
    background: gray;
    margin: 0 3px;
    border-radius: 2px;
}

    Regards,
    Josue

    June 6, 2014 at 1:46 am #275400
    morpho2014
    This reply has been marked as private.
    June 6, 2014 at 2:03 am #275405
    Josue

    Hi Neil!

    Changing the padding property in this selector will change the size of the icon box:

    #text-3 .avia_button_icon{
    padding: 5px 10px; /* <-- Tweak this values, the syntax is: top-bottom (5px) | right-left (10px) */
    color: white;
    background: gray;
    margin: 0 3px;
    border-radius: 2px;
}

    Cheers!
    Josue

    June 6, 2014 at 2:29 am #275413
    morpho2014
    This reply has been marked as private.
    June 6, 2014 at 2:49 am #275415
    Josue

    Add the following properties accordingly:

    1.

    #text-3 .avia-button .avia_iconbox_title {
color: white;
font-size: 11px !important;
font-weight: bold; /* added this */
}

    2. 

    #text-3 .avia_button_icon {
padding: 5px 10px;
color: white;
background: #c3512f;
margin: 0 3px;
border-radius: 2px;
font-size: 18px; /* added this */
}

    Cheers!
    Josue

    June 6, 2014 at 2:39 pm #275581
    morpho2014

    Thank you so much for your excellent support Josue! Very much appreciated!

    Best wishes,

    Neil

  • Author
    Posts
Viewing 13 posts - 1 through 13 (of 13 total)
  • The topic ‘How to add email button to footer?’ is closed to new replies.