Navigation
Archive / How to add links to left and right side of bottom footer (not widget).
This is archived content. Visit our new forum.

Tagged: 

  • Author
    Posts
  • July 3, 2016 at 7:29 pm #1070774
    kateanita
    Participant

    Hello, I looked through the forum and couldn’t find how to add custom links (email and phone #) to the very bottom footer (not the widget area) on the left and right side. Please see the screenshot of what I am trying to achieve.

    The site I am working on is here: http://dev.stapkodesign.com/

    Thank you!

    Katie

    July 3, 2016 at 8:48 pm #1070934
    Nico
    Moderator

    Hi There,

    Thanks for writing in.

    Would you mind uploading the image again. Don’t forget to reduce its file size so that it would be uploaded properly.

    Thanks.

    July 4, 2016 at 4:57 pm #1072032
    kateanita
    Participant

    Sorry about that! Screenshot has been re-uploaded at smaller file size.

    July 4, 2016 at 7:19 pm #1072108
    Friech
    Moderator

    Hi There,

    Thanks for the screenshot. Please update your Footer Content to this.

    <div class="left">800.200.8253</div>
<div class="center"> © 2016 Valenti International<br />16275 Via De La Valle Rancho Santa Fe, CA 92067</div>
<div class="right">EMAIL</div>

    Hope it helps, Cheers!

    July 4, 2016 at 8:55 pm #1072310
    kateanita
    Participant

    Thank you! That worked, except the elements are not all aligned to the top, and the center element is not center-aligned. You can view it here: http://dev.stapkodesign.com/

    Is there a way to center-align the center element (the address) and vertically align the left and right elements so the top of all three elements are aligned horizontally?

    Thanks again!

    Katie

    July 4, 2016 at 10:07 pm #1072341
    Friech
    Moderator

    Hi Katie,

    Oh sorry about that, I think it would be better if we divide the footer content in 3 columns. Please update my given code above to this.

    <div class="x-column x-sm x-1-3" style="padding: 0px;"><a href="tel:#" class="contact-number left-text">800.200.8253</a></div>
<div class="x-column x-sm x-1-3" style="padding: 0px;"><p class="center-text">© 2016 Valenti International<br />16275 Via De La Valle Rancho Santa Fe, CA 92067</p></div>
<div class="x-column x-sm x-1-3" style="padding: 0px;"><a href="mailto:#" class="email right-text">EMAIL</a></div>

    Hope it helps, Cheers!

    July 4, 2016 at 10:31 pm #1072351
    kateanita
    Participant

    Thanks for the quick response! I put the new code into the footer area and now the two outer elements are centered and the center element is pushed to the left. (Screenshot attached.) Any suggestions? Thanks again!

    July 5, 2016 at 1:05 am #1072421
    Christopher
    Moderator

    Hi there,

    Please provide us with login credentials so we can take a closer look.

    Thanks.

    July 5, 2016 at 11:56 pm #1074174
    kateanita
    Participant
    This reply has been marked as private.
    July 6, 2016 at 1:59 am #1074267
    Christopher
    Moderator

    Hi there,

    Please update your code in footer content area to :

    <div class="x-column x-sm x-1-3" style="padding: 0px;"><a href="tel:#" class="contact-number left-text">800.200.8253</a></div>
<div class="x-column x-sm x-1-3" style="padding: 0px;"><p class="center-text">© 2016 Valenti International<br />16275 Via De La Valle Rancho Santa Fe, CA 92067</p></div>
<div class="x-column x-sm x-1-3" style="padding: 0px;"><a href="mailto:#" class="email right-text">EMAIL</a></div>

    Hope it helps.

  • Author
    Posts
  • <script> jQuery(function($){ $("#no-reply-1070774 .bbp-template-notice, .bbp-no-topic .bbp-template-notice").removeClass('bbp-template-notice'); }); </script>