Viewing 15 replies - 1 through 15 (of 24 total)
  • Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Do you have a plugin that provides Custom CSS functionality?

    Thread Starter drandrei04

    (@drandrei04)

    I’m not sure, i’m using Montezuma theme… i have options for CSS in settings…. so it’s posible to have custom css functionality.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Can you provide a link to your website, I can’t view the demo website. It’s broken.

    Thread Starter drandrei04

    (@drandrei04)

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Example;

    Do you want the background image to be this wide https://awesomescreenshot.com/066vr0t10 ?

    Or this wide https://awesomescreenshot.com/09evr0wd4 ?

    In the meanwhile, download (and install) this Custom CSS Manager plugin. It’ll hold the CSS modifications necessary to implement your query.

    Thread Starter drandrei04

    (@drandrei04)

    First example, i’ll download the plugin right now.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Add this to the Custom CSS section of the dashboard (once the plugin is activated);

    #banner-bg {
     background: url(theURLtoYourImage.andTheFileExtensionOfIt);
     /* E.g;
     url(https://upload.wikimedia.org/wikipedia/commons/b/be/Vatican_City_at_Large.jpg)
     */
    }

    Thread Starter drandrei04

    (@drandrei04)

    Not working, but i’ve read something on a forum( i can edit from the theme menu… a file called header.php) so.. it’s php…
    i’ve tried something here, but all what is done… in the place under text.. in left corner up.. showed up a small empty image…
    how i must write?

    this is the text in header.php:

    <div id="banner-bg" class="cf">
    	<div id="banner" class="row">
    		<div id="logo-area" class="col5">
    			<<?php bfa_if_front_else( 'h1', 'h3' ); ?> id="sitetitle">
    				<a>"><?php bloginfo( 'name' ); ?></a>
    			</<?php bfa_if_front_else( 'h1', 'h3' ); ?>>
    			<p id="tagline"><?php bloginfo( 'description' ); ?></p>
    		</div>
    		<?php wp_nav_menu( array(
    			'container' => 'nav',
    			'container_class' => 'menu-wrapper col7',
    			'container_id' => 'menu1-wrapper',
    			'menu_id' => 'menu1',
    			'menu_class' => 'cf menu',
    			'theme_location' => 'menu1',
    			'fallback_cb' => 'bfa_page_menu'
    		) ); ?>
    	</div>
    </div>
    
    <a>" class="rsslink" title="<?php _e( 'Subscribe to RSS Feed', 'montezuma' ); ?>"></a>
    
    <div id="breadcrumbs1-bg">
    	<nav id="breadcrumbs1" class="breadcrumbs lw">
    		<?php bfa_breadcrumbs( 'breadcrumbs1' ); ?>
    	</nav>
    </div>

    ………………………………………………..
    and my edit… ( i’ve made a folder in wp-content/themes/montezuma/images called header and put the “panorama 1.jpg” in : so where i went wrong? open my site again to see the empty img please

    <div id="banner-bg" class="cf">
    	<div id="banner" class="row">
    	<img src="https://draghici-andrei-photos.p.ht/en/wp-content/themes/images/header/panorama 1.jpg" >
            <div id="logo-area" class="col5">
    			<<?php bfa_if_front_else( 'h1', 'h3' ); ?> id="sitetitle">
    				<a>"><?php bloginfo( 'name' ); ?></a>
    			</<?php bfa_if_front_else( 'h1', 'h3' ); ?>>
    			<p id="tagline"><?php bloginfo( 'description' ); ?></p>
    		</div>
    		<?php wp_nav_menu( array(
    			'container' => 'nav',
    			'container_class' => 'menu-wrapper col7',
    			'container_id' => 'menu1-wrapper',
    			'menu_id' => 'menu1',
    			'menu_class' => 'cf menu',
    			'theme_location' => 'menu1',
    			'fallback_cb' => 'bfa_page_menu'
    		) ); ?>
    	</div>
    </div>
    
    <a>" class="rsslink" title="<?php _e( 'Subscribe to RSS Feed', 'montezuma' ); ?>"></a>
    
    <div id="breadcrumbs1-bg">
    	<nav id="breadcrumbs1" class="breadcrumbs lw">
    		<?php bfa_breadcrumbs( 'breadcrumbs1' ); ?>
    	</nav>
    </div>

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Not to sound big-headed, but it’s a lot easier to go through the technique I suggested. To set a background image in CSS.

    I think the problem you’re having is the image cannot be found. In the CSS, if you use the background image that I exampled (which can be found), the code should work.

    Thread Starter drandrei04

    (@drandrei04)

    Yes.. you’re right.
    I’ve uploaded from the site option the image.. it said “error:the file has more than 8 mb”… i’ve uploaded another image.. it worked… i’ve copied the link to the image… and put it in your css… working… but… still i have some problems… open the site… the image is bigger then background size… i think it has 2800/3000…. what ever… which size what the background has? i can redimension it from css .. or i must do it manually?

    and the menu is over the image… take a look please

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Oh I used the wrong CSS selectors.
    In the code, instead of this;

    #banner-bg

    Use this

    #banner

    Thread Starter drandrei04

    (@drandrei04)

    ok.. this is the difference from your examples, but menu is still over the image… and the size is still big …. you didn’t answered to my question ??

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    What was your question? Make it clear.

    Thread Starter drandrei04

    (@drandrei04)

    If you open my site… you will see.
    The problem is: the image has a big size(2928x 798 pixels), what is the size in pixel to enter propertly in the banner… i can reduce it to that size from a css code.. or i must reduce it from Photoshop for e.g… and the second problem, is: a menu is over the image…. what i can do?

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    The image is particularly large, yes, but you can resize this in CSS.

    Example;

    #banner-bg {
     background: url(theURLtoYourImage.andTheFileExtensionOfIt);
     /* E.g;
     url(https://upload.wikimedia.org/wikipedia/commons/b/be/Vatican_City_at_Large.jpg)
     */
     background-size: 100%;
    }

    Is the menu not supposed to be over the image? I don’t understand your query in what you want to do.
    If you want the menu to be transparent, add this;

    #menu1-wrapper {
     background: transparent;
    }

Viewing 15 replies - 1 through 15 (of 24 total)
  • The topic ‘Header banner’ is closed to new replies.