Making Top Ad Level With Logo

[efpeterson]

Hi folks,

I’m just wondering if there is a way to make the header ad widget even with the logo? I know that the theme is responsive, but I would like to put a downloadable coupon in the header (on the right and just above the nav bar) and can’t seem to figure out how to do it with CSS. Thanks in advance for the help!

Topic

[Jason Bobich]

Hello,

The theme has no feature for this, unfortunately, and so this would be a customization you’d need to make to the theme.

You might be able to do it with CSS and absolute positioning, but it might bet a little messy, considering how the containers sit.

See here: http://dev.themeblvd.com/tutorial/primary-framework-action-hooks/

You may want to just create your own widget area, hook it to themeblvd_header_addon, then position it with CSS.

See here: http://support.themeblvd.com/forums/topic/adding-a-widget-to-header-right/#post-975

[efpeterson]

Hi there,

Thanks for the help. I probably should have already noted that I did that and the CSS was the problem. I could position the div where I wanted it and the image using padding and margins, but because the logo is responsive, the link that I wanted attached to the image was above the logo div. Any thoughts?

[Jason Bobich]

Yeah, that’s part of it being messy and why it would go better in the themeblvd_header_addon area, where it’ll be positioned in the HTML markup proceeding the logo, opposed to coming before.

Either way, you need to style your elements specifically for mobile. If that is a concern, you can’t leave that part out.

@media (max-width: 480px) {	
	.whatever {
		...	
	}
	.whatever-else {
		...
	}
}

[efpeterson]

I think I can work around it if I upload the logo and the other image as a header. Is there any way to change the URL where the logo points? Checked in the header.php and functions.php files and can’t seem to find anything.

[Jason Bobich]

I’m not quite sure I follow the logic, but you can find the logo in the the themeblvd_header_logo_default function found in /framework/frontend/functions/display.php.

I think you may find that if you take a moment to understand what an action hook is in WordPress, you may find that these customizations come a lot easier than you are thinking. I will set it up for you —

Step 1: Skim this article on what action hooks are in WordPress.

http://dev.themeblvd.com/tutorial/actions/

Step 2: Install a child theme.

Step 3: Put this in your Child theme’s functions.php and watch what happens on your site.

function my_header_addon() {
	?>
	your HTML content here ...
	<?php
}
add_action( 'themeblvd_header_addon', 'my_header_addon' );

=========

Trust me, after you get this basic concept under your belt, you’ll have so many possibilities just from your Child theme’s functions.php. For example, if you wanted, you could unhook the current logo function all together, and just fill the entire header with your own HTML, if you wanted.

// Remove default logo
remove_action( 'themeblvd_header_logo', 'themeblvd_header_logo_default' );

// Add custom header content
function my_header() {
	?>
	your HTML content here ...
	<?php
}
add_action( 'themeblvd_header_content', 'my_header' );

This is all mapped out here: http://dev.themeblvd.com/tutorial/primary-framework-action-hooks/

[Author]

Replies