HEADER MODIFICATION

Hi!

Some time ago I asked you the question about header: ” I’d like to put my phone number in the right corner of the header (please check screenshot). How can I do that?”

You replied that I need to change header format in order to be able to put text in header. However, I really need to keep simplified header format and still have phone number in there (see screenshot).

Are you sure that there’s no option to do that? Maybe custom CSS will help? If so, please provide it. And thank you in advance!

Attachments:

You must be logged in to view attached files.

Hello,

Please have a look at the screen http://prntscr.com/l7jg7u

One more way: you can add the phone number to the last menu item of your main menu without changing the header format.

Best Regards

Okay thank you! I chose base header. How can I make my phone number visible in the mobile version?

Hello,

Navigate to the Theme Settings > Header > Top Bar and activate it. Insert the phone number there. It will be visible on mobile.

Best Regads

Thank you!

Can you please answer some questions about Logo Center header? Please answer all questions for desktop and mobile if there’s difference in settings. Please see screenshot.

1) Now I have menu on the left. How can I put it in the center right under the logo?
2) How can I remove grey separation lines between logo and menu and between menu and next block?
3) How can I remove My account/Logout part?

Thank you!

Attachments:

You must be logged in to view attached files.

Hello,

1. Navigate to the Theme Settings > Header > Main Menu > http://prntscr.com/l7uyh7

2. Add this code to the Theme Settings > Custom CSS:

.navigation-wrap {
    border-top: 1px solid transparent;
    border-bottom: 1px solid transparent;
}

3. Navigate to the Theme Settings > Header > My account > Deactivate

Best Regards

Hello!

I have a question related to your answer #83713 (phone number in the header for desktop and mobile).

If I switch on the top bar, in desktop version it looks like on the screenshot 1. Please have a look. And in the mobile, I have phone number above the logo. (see screenshot 2).

1) Is it possible to put phone number right under the logo in mobile version without changing anything in the desktop (because in desktop version phone number is already there in a good position)? If it requires custom CSS or some other modifications, please help me with it, it’s important.

2) Also, is it possible to make phone number clickable in mobile version so that when people click on it they have an option to call this number immediately without the need to copy and paste it to make a call?

Thank you very much!

Attachments:

You must be logged in to view attached files.

Hello,

1. No, it is not possible, you will have to add the phone number to the top bar.

2. Insert this instead of your phone number <a href="tel:+74950052358">+7 (495) 005-2358</a>

You can add a class to the link and hide on the desktop and show only on mobile if you decide to add to the top bar and show only on mobile:

<a class="phone_click" href="tel:+74950052358">+7 (495) 005-2358</a>

And add this code to the Theme Settings > Custom CSS > Desktop:

.phone_click{
display:none;
}

Best Regards

Hi,

Maybe I misunderstood you or maybe there’s a mistake in your code.

I used code +7 (495) 005-2358 instead of phone number in the top bar, because I want to have clickable phone number in mobile and I don’t need top bar in desktop. I also added this code to CSS Desktop .phone_click{
display:none;
}

Please see screenshot. This is how it looks on both desktop and mobile now.

Can you help please? Thank you!

Attachments:

You must be logged in to view attached files.

I added the code you sent to me to the previous message and it automatically converted into a clickable phone number. But when I use this code in the top bar, it doesn’t happen.

Hello,

I have checked the code it does not contain any mistakes and works on desktop and on mobile.

I have added the custom CSS and code disappears on the desktop and appears in mobile.

Make sure you have inserted the code properly.

Best Regards

Sorry, you’re right, it was my mistake. Now it works, thank you!

One more short question (see screenshot):

I have grey line at the bottom of top bar. How do I remove it?

Also, I have grey line at the bottom of menu on some pages (blog page, for ex.). How do I remove this line from pages where it is now?

Thank you!

Attachments:

You must be logged in to view attached files.

Hello,

Navigate to the Theme Settings > Header > Appearance and disable border http://prntscr.com/l9dfnz

If it does not help, add this code to the Theme settings > Custom CSS:

body .main-header{
    border-bottom: none;
    border-top:none;
}

Best Regards

Unfortunately, neither of this actions helped to remove the lines, they all are still there. Is there any other solution?

Hello,

Update your site admin access I cannot log in.

Best Regards

Please find my login data below. It would be great if you could not only hide grey line but hide the entire top bar on desktop.

Also, I have several user experience related questions.

1. I’d like to make some elements in header and footer bigger. How can I do that?

– Phone number in header
– Shopping cart icon in header
– Phone number and email address in footer

Now in footer Column 1 I have the following code: <p style=”text-align:left;”></p>[social_buttons type="follow"]<br>+7 (495) 005 23 58 <br> hello@silksilk.ru

2. How can I make phone number in header clickable on desktop?

3. Sometimes in the checkout page people miss a digit in the phone number and I cannot contact them about their order. Is it possible to make number validation? So that people could make an order only if they type 10 digits after country code +7?

4. Please see screenshot 1. For some reason, in the shopping cart, on the upper button the text color is grey instead of white. How can I change that?

5. I’d like to see how mobile version of the website looks without mobile optimisation. How can I temporarily switch off mobile optimisation to see how the site will look like?

6. I updated a logo. On mobile a new logo and cart icon are not at the same level. Please see screenshot 2. Is it possible to move cart icon and menu icon down a little bit or align them in any other way?

Thank you very much in advance for your help!

Attachments:

You must be logged in to view attached files.

Hello,

1. Navigate the Theme Settings > Header you will find all the options.

2. Clickable number, please read above

3. Footer: Theme Settings > Footer

4. Theme Settings > Header > Appearance

5. There is no option.

6. Please choose another header layout if you want another look.

Best Regards

Hello, thank you for your answers.

Can you please help me with my question #84559 (grey lines) because none of the solutions that you suggested in your answer #84505 worked. Before you asked for admin access to help me with this issue, I sent it to you in the previous message.

Can you please answer my questions number 3 and 4 from my previous message again more in detail? Your answers didn’t help me solve my issues. Thanks for understanding.

Hello,

Replace the code provided with this one:

.topbar-wrapp {
    border-bottom: none;
}

3. Validation of phone number is not provided by Woocommerce our theme does not have any options either.

4. Add this code to make button color white:

.widget_shopping_cart .buttons a {
    width: 100%;
    color: #ffffff;
}

Best Regards

Thank you very much, it worked now 🙂

Just one tiny question: on the cart page the text on button is also grey (see screenshot), please provide code to make it white. Thank you!

Attachments:

You must be logged in to view attached files.

Hello,

Please add this code to the Theme Settings > Custom CSS:

.cart-actions .button{
    color:#ffffff;
}

Best Regards

[Author]

Posts