Venture Theme - Header Grid Help

Solved
New Member
12 0 0

Hi Guys,

 

I have making changes to my site to move all header items onto one row and setup as follows:

 

Logo (Left Align) > Nav (Center Align) > Cart Icon (Right Align)

 

All works fine on mobiles so just desktops needed.

 

Would anyone be able to assist as i'm struggling with the grid layout.

 

Site link is: https://everglo-ring.com

 

Thanks 

Dan

0 Likes

Success.

Hello @DBryant912,

1. Go to Online Store->Theme->Edit code
2. Asset->theme.scss.liquid->paste bellow code in bottom of file

.cart-search .site-header__link {
	padding: 10px 5px;
}
#SiteNavSearchCart {
	float: left;
}
#SiteNavSearch {
	max-width: 30px;
}
#SiteNav {
	text-align: center;
}
Want to modify or incorporate custom changes on store, Hire us.
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Free Review and advice for sale on store | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | SEO & Digital Marketing | Site Speed Optimization | Performance Site Audit
0 Likes
New Member
12 0 0

Hi OSC,

 

I have added the below code and although it looks better the logo and nav need swapping locations, i'm looking to have the logo in the middle and nav on the left.

 

Thanks

Dan

0 Likes

Success.

@DBryant912,

Remove this css

#SiteNav {
	text-align: center;
}

Add below css in theme.scss

.flex-tab {
	display: flex;
}
.logo-block {
	order: 2;
	width: 46%;
	margin-top: 20px;
}
#SiteNavParent {
	order: 1;
	width: 50%;
}
.cart-search {
	order: 3;
	margin-top: 10px;
}
Want to modify or incorporate custom changes on store, Hire us.
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Free Review and advice for sale on store | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | SEO & Digital Marketing | Site Speed Optimization | Performance Site Audit
0 Likes
New Member
12 0 0

Looks great thank you, the only issue now is that the Logo is slightly off to the right and not center

 

Thanks for your help

 

0 Likes
New Member
12 0 0

All sorted by changing the width from 50% to 45% on the CSS.

 

Thank you so much for your help.

 

If anyone wants to know how to change Venture theme so that the Menu, Logo and Cart Icon all sit on a single header drop me a message.

 

Thanks

Dan

0 Likes