Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Trying to center logo and split links in 7.1


Juicebox

Question

Site URL: http://www.bellasinpired.co

I am working with a client who has it in their heads that they want their logo centered and the links in the header to be on opposite sides of the banner. I built this site in 7.1 and obviously do not have the option now to convert to a template that can achieve this. I'm not sure what to do? I've seen in the forums that you can insert code to do it but sadly am not sure where to start.

Any ideas of what I can do? See below for Bella's (my client) header vs the header she wants.

Feel free to look at the site as well http://www.bellainspired.co password is bella

Screen Shot 2020-09-19 at 1.36.07 PM.png

Screen Shot 2020-09-19 at 1.37.35 PM.png

Link to post
  • Answers 15
  • Created
  • Last Reply

Top Posters For This Question

15 answers to this question

Recommended Posts

  • 0
On 9/21/2020 at 3:11 AM, tuanphan said:

You need both CSS + JavaScript to do this (Need a Business Plan or higher).

The idea here is to add a Navigation to the right of the logo, then hide some items in both menus. Hope this help.
I coded this for a few clients recently.

Thank you for the help! I am communicating with the client now about this change. Disappointed I can't just swap out templates like in 7.0

How can I utilize your skills to help with my client if they want to pursue this change?

Link to post
  • 0
On 9/23/2020 at 2:08 AM, Juicebox said:

Thank you for the help! I am communicating with the client now about this change. Disappointed I can't just swap out templates like in 7.0

How can I utilize your skills to help with my client if they want to pursue this change?

There are 2 solutions to do this.

Free option. When you need it, just share the url, we will take a look

Paid option. You can contact me via link in the signature.

Both of them help you achieve the above layout. 

You can send your question to my email to get detail answer. / How to Setup Password & Share URL 

-- Pour your heart into it

Link to post
  • 0
22 hours ago, tuanphan said:

There are 2 solutions to do this.

Free option. When you need it, just share the url, we will take a look

Paid option. You can contact me via link in the signature.

Both of them help you achieve the above layout. 

That would be fantastic! The URL is http://www.bellainspired.co password is bella Thank you so much! She will be thrilled!

Link to post
  • 0
11 minutes ago, Juicebox said:

That would be fantastic! The URL is http://www.bellainspired.co password is bella Thank you so much! She will be thrilled!

Adjust your header layout to Left Menu - Logo.

Next, insert a Text Block in Footer > Enter text links (we will use text links as Navigation items)

Then I will use jQuery to move it to right of Logo

Final, I will use CSS to hide some items in the left menu.

You can send your question to my email to get detail answer. / How to Setup Password & Share URL 

-- Pour your heart into it

Link to post
  • 0
16 hours ago, tuanphan said:

Adjust your header layout to Left Menu - Logo.

Next, insert a Text Block in Footer > Enter text links (we will use text links as Navigation items)

Then I will use jQuery to move it to right of Logo

Final, I will use CSS to hide some items in the left menu.

Done! Let me know if I set it up correctly for you!

Link to post
  • 0
10 hours ago, tuanphan said:

Hi,

You want: 

  • Left Menu - Logo - Right Menu?
  • OR Left Menu - Logo - Right Menu/Instagram/Button?

The client is looking for a minimal look (I know right) so left menu - logo - right menu would be great. I can just drop the social in the footer or on the home page.

Link to post
  • 0
On 9/27/2020 at 8:15 AM, Juicebox said:

The client is looking for a minimal look (I know right) so left menu - logo - right menu would be great. I can just drop the social in the footer or on the home page.

Hey @tuanphan Did I get the page set up the way you need it?

Link to post
  • 0
20 hours ago, tuanphan said:

Which text link on footer?

 

Does this work? Or do I need to remove all text without a hyperlink or lay it out a certain way?

Screen Shot 2020-09-30 at 1.42.59 PM.png

Link to post
  • 0
On 9/30/2020 at 1:43 PM, Juicebox said:

Does this work? Or do I need to remove all text without a hyperlink or lay it out a certain way?

Screen Shot 2020-09-30 at 1.42.59 PM.png

@tuanphan Let me know if I laid this out correctly! Or if I whiffed on it

Link to post
  • 0

Add to Code Injection Footer

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
  jQuery(document).ready(function($) {
	$('div#block-da11d007411e207dc85d p:nth-child(2)').insertBefore('.header-actions.header-actions--right .header-actions-action:first-child');
});
</script>

 

You can send your question to my email to get detail answer. / How to Setup Password & Share URL 

-- Pour your heart into it

Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...