Make Debut theme footer links neater on desktop?

coff001
Tourist
32 0 1

See image, footer looks sloppy.  Is there a way to make these into 1 or 2 rows for the Debut theme? It's all 1 column on mobile, but desktop is ugly:

messyFooter.JPG

Thanks for the help.

0 Likes
suma
Tourist
8 1 1
Hi,
I checked your description carefully. I am familiar with Shopify  web design. I have developed a lot of websites with Shopify.Successfully Launch Your Shopify store 7 in Easy Steps.
1.SING UP
2.THEMES
3.PRODUCTS
4.PAYMENT GATEWAY
5.PAGES
6.BLOG
7.LAUNCH
 Included  My Service;
✓ Domain Connect ✓ Sales Channel ( Facebook) ✓ Facebook Pixel ✓ Facebook Shop ✓ Pages ( About, Contact, FAQ, Privacy,  Refund, Shipping) ✓ Google Analytics ✓ Social Pages Connect ✓ Payment Gateway Setup ✓ ) shopify SEO description and content optimization  full seo in your store.
One thing I am especially good at is getting your job done quickly and 100% to your satisfaction.
Please initiate a chat session for more discussion about the project. I am looking forward to working with you.
+880 01819456590
0 Likes
Natztech
Shopify Partner
683 189 459

Would you mind sharing your store's URL and point out the issue you're trying to solve? 

Thanks! 

Want to theme customize contact us E-mail : natztech2312@gmail.com
If helpful then please Like and Accept as Solution

PageFly Advanced Page Builder- My favorite drag and drop page builder - Visit the Shopify app store
0 Likes
coff001
Tourist
32 0 1

Site: amourfatale.co, password is aiclai , just scroll to the footer.

I don't think it's necessary to keep sharing my URL, it's just debut theme default and I'd rather stay private. But am sharing this info to get this resolved.

0 Likes
Natztech
Shopify Partner
683 189 459

please  Go to Online Store->Theme->Edit code
then go to  Asset->/theme.scss.liquid->paste below code at the bottom of the file.

 

.list--inline>li {
    display: flex !important;
   
}

.payment-icons  .payment-icon {
    display: inline-block !important;
    float: left !important;
    margin-right: 12px !important;
   
}

 

Want to theme customize contact us E-mail : natztech2312@gmail.com
If helpful then please Like and Accept as Solution

PageFly Advanced Page Builder- My favorite drag and drop page builder - Visit the Shopify app store
0 Likes
coff001
Tourist
32 0 1

That didn't work, the footer links are now 1 column but now so is the top nav, see screenshot. Top nav must stay hoizontal.  FYI removed the code because it didn't work.

topNavScrewedUp'.JPG

0 Likes
suma
Tourist
8 1 1
I am familiar with Shopify web design. I have developed a lot of websites
with Shopify. Yes i can help you.
0 Likes
suma
Tourist
8 1 1

I can solve your problem.

0 Likes
Natztech
Shopify Partner
683 189 459

hey sorry for facing this issue now please remove my old code and insert below code it definetly work

 

.site-footer__content .site-footer__item ul.site-footer__linklist {
 width: 25% !important;
}

@media only screen and (max-width: 600px)
{
 .site-footer__content .site-footer__item ul.site-footer__linklist {
width: 100% !important;
}
}
Want to theme customize contact us E-mail : natztech2312@gmail.com
If helpful then please Like and Accept as Solution

PageFly Advanced Page Builder- My favorite drag and drop page builder - Visit the Shopify app store
0 Likes
coff001
Tourist
32 0 1

Is it possible to get all the links to not show as 1 word per line? For example:

"Terms of Service", not

"Terms

of

Service"

Also, I'd like to have a max 6 links per column, so any new links will go into a second column, is this possible? 

I'd like it to look like the footer of this site: https://dhappymakers.com/

0 Likes