Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #310675

    hi there,
    so i’m trying to do a footer that has 3 columns but the second one is larger.
    what i managed to do is on the home page as the last colour section: http://magento.org.il/cloudally/
    but i want to put the code of it in the footer widget as 1 column, so that the blog page will still look like i want it to look

    so what i did is after publishing the one page, to copy the code of this last section and put it inside the footer widget.

    this is what i put in the footer widget as column 1 which will be the only column:

    	<div id='av_section_1' class='avia-section main_color avia-section-default avia-no-shadow avia-bg-style-scroll  avia-builder-el-0  avia-builder-el-no-sibling  container_wrap fullsize' style = 'background-color: #f2f2f2; '  ><div class='container'><main  role="main" itemprop="mainContentOfPage"  class='template-page content  twelve alpha units'><div class='post-entry post-entry-type-page post-entry-318'><div class='entry-content-wrapper clearfix'>
    <div class="flex_column av_one_fifth first  avia-builder-el-1  el_before_av_three_fifth  avia-builder-el-first  ">
    <span class="av_font_icon avia_animate_when_visible av-icon-style-  avia-icon-pos-left " style="color:#435f9f; border-color:#435f9f;"><a href='https://www.facebook.com/CloudAllyPage'   class='av-icon-char' style='font-size:25px;line-height:25px;' aria-hidden='true' data-av_icon='' data-av_iconfont='entypo-fontello' ></a></span>
    <span class="av_font_icon avia_animate_when_visible av-icon-style-  avia-icon-pos-left " style="color:#f1f1f1; border-color:#f1f1f1;"><span class='av-icon-char' style='font-size:25px;line-height:25px;' aria-hidden='true' data-av_icon='' data-av_iconfont='entypo-fontello' ></span></span>
    <span class="av_font_icon avia_animate_when_visible av-icon-style-  avia-icon-pos-left " style="color:#50abf1; border-color:#50abf1;"><a href='https://twitter.com/CloudAlly'   class='av-icon-char' style='font-size:25px;line-height:25px;' aria-hidden='true' data-av_icon='' data-av_iconfont='entypo-fontello' ></a></span>
    <span class="av_font_icon avia_animate_when_visible av-icon-style-  avia-icon-pos-left " style="color:#f1f1f1; border-color:#f1f1f1;"><span class='av-icon-char' style='font-size:25px;line-height:25px;' aria-hidden='true' data-av_icon='' data-av_iconfont='entypo-fontello' ></span></span>
    <span class="av_font_icon avia_animate_when_visible av-icon-style-  avia-icon-pos-left " style="color:#dd4b39; border-color:#dd4b39;"><a href='https://plus.google.com/+Cloudally/posts'   class='av-icon-char' style='font-size:25px;line-height:25px;' aria-hidden='true' data-av_icon='' data-av_iconfont='entypo-fontello' ></a></span>
    </div><div class="flex_column av_three_fifth   avia-builder-el-7  el_after_av_one_fifth  el_before_av_one_fifth  ">
    <section class="av_textblock_section"  itemscope="itemscope" itemtype="https://schema.org/CreativeWork" ><div class='avia_textblock '  itemprop="text" ><div class="footer_links" style="text-align: center;"><a id="footer_links_home" href="/">Home</a> <span class="footer_devider"> | </span> <a href="/Blog">Blog</a> <span class="footer_devider"> | </span> <a href="/cloudally-faq">FAQ</a> <span class="footer_devider">| </span> <a href="/terms-of-use" rel="nofollow">Terms of Use</a> <span class="footer_devider">| </span> <a href="/privacy-policy" rel="nofollow">Privacy Policy</a> <span class="footer_devider">| </span> <a href="/why-choose-cloudally">Why CloudAlly</a><span class="footer_devider"> | </span><a href="/catalog">Backup Services</a><span class="footer_devider"> | </span><a href="/contact-us">Contact Us</a><br />
    <a href="/SLA">Service Level Agreement</a> <span class="footer_devider"> | </span> <a href="/partners">Partner Programs</a> <span class="footer_devider"> | </span><a href="/enterprise-contact-us">Enterprise Backups</a></div>
    </div></section>
    </div><div class="flex_column av_one_fifth   avia-builder-el-9  el_after_av_three_fifth  avia-builder-el-last  ">
    <section class="av_textblock_section"  itemscope="itemscope" itemtype="https://schema.org/CreativeWork" ><div class='avia_textblock '  itemprop="text" ><p><img src="http://magento.org.il/cloudally/wp-content/uploads/2014/08/powered.png" alt="powered by amazon web services" width="230" height="70" /></p>
    </div></section>
    </div>
    
    </div>

    and this is how it looks like now:
    http://magento.org.il/cloudally/?page_id=194

    as you can see i’ve almost succeed, but i have a border i can’t get rid of. so can you please help me solve this? is this a proper way of managing the un-even footer columns i’m trying to achieve?

    any help will be appreciated,

    thank you!

    #310947

    Get rid of the top-border in the footer, put in your custom css:

    
    #footer .container_wrap {
        border-top-width: none;
    }
    
    #311741

    Hi!

    Please add following code to Quick CSS in Enfold theme options under General Styling tab

    #footer #av_section_1 {
    border: none!important;
    }

    Cheers!
    Yigit

    #391424
    This reply has been marked as private.
    #391746

    Hi Soren!

    It is aligned but the upper three images have some inner padding so you’d need to add that to the footer widgets too:

    #footer .widget {
        padding: 0 16px;
    }

    Cheers!
    Josue

Viewing 5 posts - 1 through 5 (of 5 total)
  • You must be logged in to reply to this topic.