Hi there,
Could you please help me with adding a backgroung image to header style 4 and move the menu items to the right side?
I tried the following to add the background image but to no avail
/* Change Menu Background Image*/
.td-boxed-layout .td-logo-rec-wrap {
background: url(http://(deleted URL).png) !important;
}
I’ve added this to my Newspaper child team folder under Style.css
Thanks
FP
Hi,
1. Try the following css: – http://screencast.com/t/2W93kIfgMAxm
.td-header-style-4 .td-header-header {
background: white url('http://imgscenter.com/images/2014/09/13/Beauty-of-nature-random-4884759-1280-800.jpg') no-repeat;
background-size:cover;
}2. Use the following css: – http://screencast.com/t/BoHwgXSBsW
#menu-td-demo-header-menu-1{
display: table;
float: none;
margin-left: auto;
margin-right: 0;
}Thank you!
Hi Emil,
Thanks for your reply but i’m afraid that none of them worked 🙁
I have put both in the style.css of my child team as shown below but it still looks the same. Also i’ve noticed that on your screengrab http://screencast.com/t/2W93kIfgMAxm it appears that your image is in the background of the Add area and not of the menu itself, your menu (where your little 6 logo is) is still black, that is where i want my background image to go please 🙂
Here’s my site: http://fuzzy-yellow.com/
/*
Theme Name: Newspaper 6 Child theme
Theme URI: http://themeforest.net/user/tagDiv/portfolio
Description: Child theme made by tagDiv
Author: tagDiv
Author URI: http://themeforest.net/user/tagDiv/portfolio
Template: Newspaper
Version: 6.0c
*/
/* —————————————————————————-
This file will load automatically when the child theme is active. You can use it
for custom CSS.
*/
/* Change Menu Background Image*/
.td-header-style-4 .td-header-header {
background: white url(‘http://imgscenter.com/images/2014/09/13/Beauty-of-nature-random-4884759-1280-800.jpg’) no-repeat;
background-size:cover;
}
/* Change Menu Items to the Right*/
#menu-td-demo-header-menu-1{
display: table;
float: none;
margin-left: auto;
margin-right: 0;
}
Hi,
The header style 4 has boxed menu, you need to set the menu transparency if you want the background image also on menu http://screencast.com/t/NsRB6sPol – http://screencast.com/t/7oIcu75lL9M
And use this custom css in Theme Panel > Custom Css:
.td-header-style-4 {
background: white url('http://imgscenter.com/images/2014/09/13/Beauty-of-nature-random-4884759-1280-800.jpg') no-repeat;
background-size:cover;
}
Thanks!
That is great Alin, thank you very much 🙂
There is only a slight issue now, this sort of breaks my menu on the mobile view, the image covers my top-bar as it does on Desktop but the menu itself now shows transparent but with no background image. Is this an easy fix Alin?
Many Thanks
FP
Hello enpomedia,
It seems you have a custom CSS that sets the mobile background color to white. If you want it set to transparent just change the css that Andrei gave you: https://forum.tagdiv.com/topic/how-can-i-change-the-color-of-moblie-main-menu/ and replace the #fff color to transparent
It should look like this:
@media(max-width: 767px) {
.td-header-wrap .td-header-menu-wrap-full, .td-header-wrap .td-header-menu-wrap, .td-header-wrap .td-header-main-menu {
background-color: #transparent !important;
}Thank you.
Thank you for your help :).
