Debut Theme Questions

staceymollenhau
Tourist
8 0 2

1. Is there a way to change the links in the footer to show in a column verses across in a line?

2. Is there a way to add an option in the header bar for "search", "Account" and "Cart"?

3. Is there a way to add social media icons/links in the footer

 

Thanks!

Stacey

0 Likes
BStubbs
Shopify Partner
124 14 49

Hi Stacey,

 

Welcome to the Shopify Community Forums!

I hope this helps:

1. In your Theme, select Edit Code. Then from the list on the left hand side, find the "Sections" section and there will be a file called "footer.liquid". In that file, use the Find tool bar, (Cmd-F if you are on a Mac) and search for "{% if inline_list %}list--inline{% endif %}" when you find it, just remove that bit of code. Your links will now always show up in a column.

2. On my Debut, there is a Search and Cart link already there, they are the magnifying glass and shopping bag, are you looking for something else?

3. The links to your socials will show up once you've set your liks in the Theme settings. Go to "Customise Theme" and at the top of the left hand bar there is an option called "Theme Settings". Go to the Social Media option and add in the links to your socials. When you save the Theme you'll have the links in the Footer!

Good luck!

Was this helpful? Press like!
Did it fix the problem? Mark it as the solution for others!
Buy me a beer? Well, sure!
staceymollenhau
Tourist
8 0 2
Thank you! I see the account and cart icons now! The social media icons
also show at the very bottom, I had missed those. Do you know if there is a
way to add them in the footer in the empty space between the links and
newsletters?


[image: image.png]
BStubbs
Shopify Partner
124 14 49

Hi Stacey,

Yes there is. Follow these steps and you'll end up looking something like the image below. A couple of things to keep in mind, if you use this method you won't be able to use the 'text' function in any other part of your footer, but if this is the look you want then thats probably not a big deal. Also, the more icons you have the list may not automatically wrap around, so it might look weird if you have too many social links.

BStubbs_0-1599625931051.png

1. Go to your theme and select Customise.

2. From the sidebar on the left, scroll to the bottom and click Footer

3. Again scroll to the bottom and find the bit titled Content, at the bottom there is a button called Add Content. Click it and select "Text".

4. Drag that new text box up so that it sits between the Quick links and Newsletter. Now change the title of the new Text to be blank. Don't worry about any text in that box. Dont forget to click Save at the top right.

5. Bottom left again, click Theme Actions > Edit Code.

6. Find the Footer.Liquid file, it will be under Sections.

7. On line 234 of this file, or near to it, there should be a tag that says:

{%- assign socials = "Facebook Twitter Pinterest Instagram Tumblr Snapchat YouTube Vimeo" | split: ' ' -%}

You want to copy that line and paste it up near the first <div> tag.

8. Next, use the search function to find 'block.settings.text'. There should be two entries for it. Go to the first one in the file. 

9. Immediately below that first reference, there will be a <div>, replace that with the following code:

 

<ul class="list--inline site-footer__social-icons social-icons site-footer__icon-list">
                  {%- for social in socials -%}
                    {%- assign social_link = social | prepend: 'social_' | append: '_link' | downcase -%}
                    {%- assign icon_link = social | prepend: 'icon-' | downcase -%}
                    {%- if settings[social_link] != blank -%}
                <li class="social-icons__item">
                  <a class="social-icons__link" href="{{ settings[social_link] | escape }}" aria-describedby="a11y-external-message">
                    {%- include icon_link -%}
                    <span class="icon__fallback-text">{{ social }}</span>
                  </a>
                </li>
              {%- endif -%}
            {%- endfor -%}

            {%- if request.page_type == 'blog' or request.page_type == 'article' -%}
              <li>
                <a class="social-icons__link" href="{{ shop.url }}{{ blog.url }}.atom">
                  {% include 'icon-rss' %}
                  <span class="icon__fallback-text">RSS</span>
                </a>
              </li>
            {%- endif -%}
          </ul>

 

10. Save the file.

11. Ok, you should now be good to go, if you want to remove the icons from the very bottom of the page, follow the next two steps.

12. Search for 'if social_icons' and idenitify the IF and corresponding ENDIF statements.

13. Select all the code between the IF and ENDIF and delete. Save the file and then the Social media icons will appear next to the links, and not at the bottom of the page.

Was this helpful? Press like!
Did it fix the problem? Mark it as the solution for others!
Buy me a beer? Well, sure!
0 Likes
WebAccoustic
New Member
6 0 0

I have been using Debut theme since 2015, Now I got the bugs on the debut theme demo and on my site. here is the demo

https://themes.shopify.com/themes/debut/styles/default/preview

when you added the product into cart then gotot the checkout page, and try to add more quantity through quantity select, when you increase it and then again you click it, it will decrease the value. As when you clicked on the up arrow it will increase the number in quanity through ajax sundely our mouse over will shifted to down arrow and you will not aware this, then again you hit the above arror it will decrease the value, Please play around the quantity box on the cart page, you realize its not working properly. 

here is the screenshot of the cart page where I am referring
https://www.awesomescreenshot.com/video/2113938?key=af701ad6dbbe92eb6ce925899bffcee1



I hope debut theme developer involve in this thread to fix the issue. 

Please help me out as its not a good practice, I am using this store on my site and my customer completing me about the issue. 


 

0 Likes