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
444 111 229

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

Thanks! 

Create your Shoppable Instagram Feed on your online store with AllFetch app

Want to theme customize contact us E-mail : natztech2312@gmail.com
If helpful then please Like and Accept as Solution
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
444 111 229

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;
   
}

 

Create your Shoppable Instagram Feed on your online store with AllFetch app

Want to theme customize contact us E-mail : natztech2312@gmail.com
If helpful then please Like and Accept as Solution
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
444 111 229

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;
}
}
Create your Shoppable Instagram Feed on your online store with AllFetch app

Want to theme customize contact us E-mail : natztech2312@gmail.com
If helpful then please Like and Accept as Solution
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