I am trying to edit the top header on the picture i have joined, its the mobile version of my site and id like to edit the black part on the top to keep only my phone number.
*edit*
I found the emplacement to do this, i deleted the black space and kept only my phone number but it also does the same on the desktop version.
Can you tell me how to edit only on the mobile version please
If I understand it correct you want to hide all the topbar widgets from mobile view, except for your phone number while leaving all the topbar widgets visible on desktop screens?
You can do this by adding the widgets that are visible on your attached screenshot within that same order to the topbar. Then copy/paste the following CSS code to Appearance -> Customize -> Additional CSS:
/* Remove topbar widgets except second widget on mobile */
@media (max-width: 991px) {
.topbar .widgets-left,
.topbar .widgets .widget:not(:nth-child(2)) {
display: none;
}
}
This CSS code will hide everything in the topbar, except for the 2nd widget (which should be your phone number) on mobile screens.
Hope this helps, let me know if you have any questions.
Hello mate !
I am trying to edit the top header on the picture i have joined, its the mobile version of my site and id like to edit the black part on the top to keep only my phone number.
*edit*
I found the emplacement to do this, i deleted the black space and kept only my phone number but it also does the same on the desktop version.
Can you tell me how to edit only on the mobile version please
Attached files: 1.jpg
Hi there,
Thank you for your message.
If I understand it correct you want to hide all the topbar widgets from mobile view, except for your phone number while leaving all the topbar widgets visible on desktop screens?
You can do this by adding the widgets that are visible on your attached screenshot within that same order to the topbar. Then copy/paste the following CSS code to Appearance -> Customize -> Additional CSS:
/* Remove topbar widgets except second widget on mobile */ @media (max-width: 991px) { .topbar .widgets-left, .topbar .widgets .widget:not(:nth-child(2)) { display: none; } }This CSS code will hide everything in the topbar, except for the 2nd widget (which should be your phone number) on mobile screens.
Hope this helps, let me know if you have any questions.
Best regards,
Barry
QreativeThemes.com | WordPress Themes