Venture Theme - Header Grid Help

Solved
Highlighted
Tourist
12 0 1

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
Highlighted

This is an accepted solution.

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
Whats app
Free Website Review and advice for sale from Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO ; Digital Marketing & amp | Site Speed Optimization | Performance Site Audit
0 Likes
Highlighted
Tourist
12 0 1

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
Highlighted

This is an accepted solution.

@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
Whats app
Free Website Review and advice for sale from Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO ; Digital Marketing & amp | Site Speed Optimization | Performance Site Audit
0 Likes
Highlighted
Tourist
12 0 1

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
Highlighted
Tourist
12 0 1

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

1 Like
Highlighted
New Member
3 0 0

Hello! I saw the comment and I would like to know how to align the menu in the same line as the logo in the VENTURE theme.

 

Tnk

0 Likes
Highlighted
New Member
1 0 0

Hi Dan,

 

Just wondering how to get my logo, menu and cart on a single header here:

 

routesgallery.com

 

Thanks,

RIchard

0 Likes
Highlighted

Hello ,

I checked this site it display shopify sign up.

Please share your site url correctly.

So that i will check for the best possibility to display all in one line.

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
Whats app
Free Website Review and advice for sale from Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO ; Digital Marketing & amp | Site Speed Optimization | Performance Site Audit
1 Like
Highlighted
Tourist
4 0 0

Hi @oscprofessional ,

I followed the first code you sent on the thread but so far not showing up in the same row/line for me:

Logo, menu ,  search , cart

Can you pretty please help me? Been trying to crack this for ages.

Our store URL is: 

https://drinking-fountain-super-store.myshopify.com/

 

The password is: superstore22

 

Thank you very much in advance.

0 Likes