Problem with site header

Resolved

(@chickenz)

Hello,

I’m having an issue with putting all the objects in the header of my page in one horizontal line. The site is http://pavilioncenter.ro , and the order they should be in is: the logo (Pavilion center for…), the button for language, the button for Facebook and the button for news.

The were some modifications made in the theme editor in the header.php file and after that it went haywire. Currently the entire content of the file is:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" <?php language_attributes(); ?>>

<head profile="http://gmpg.org/xfn/11">

<meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />
<title><?php bloginfo('name'); ?> <?php if ( is_single() ) { ?> » Archive <?php } ?> <?php wp_title(); ?></title>

<meta name="generator" content="WordPress <?php bloginfo('version'); ?>" /> <!-- leave this for stats -->
<!-- Styles -->
<link rel="stylesheet" type="text/css" href="<?php bloginfo('stylesheet_url'); ?>" />
<link rel="stylesheet" href="<?php bloginfo('template_directory'); ?>/css/print.css" type="text/css" media="print" />
<!--[if IE]><link rel="stylesheet" href="<?php bloginfo('template_directory'); ?>/css/ie.css" type="text/css" media="screen, projection" /><![endif]-->
<link rel="alternate" type="application/rss+xml" title="<?php bloginfo('name'); ?> RSS Feed" href="<?php bloginfo('rss2_url'); ?>" />
<link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />
<?php wp_head();
$options = get_option('f8_theme_options');
?>
</head>

<body <?php body_class(); ?>>
<div class="container">
<div class="container-inner">

<!-- Begin rss -->

<div class="clear"></div>

<!-- Begin Masthead -->

<div id="mainNav"><img src="http://pavilioncenter.ro/wp-content/uploads/2014/11/logo_centru_basic1.jpg" margin="auto" alt="home">
<div id="lang">ROEN</div>
<div id="fb"><img src="/img/fbicon.jpg" alt="Pavilion on Facebook"/></div>
<div id="news"><img src="/img/newsicon.jpg" alt="Pavilion Newsletter" /></div></div>

<span class="contact"><?php if ( $options['phone'] != '' ) { ?><?php echo $options['phone']; ?><?php } if ( $options['email'] != '' ) { ?>"><?php echo $options['email']; ?><?php } ?></span></h4>
</div>

<!-- Begin Navigation -->
<?php f8_theme_nav(); ?>

I’m running WP version 3.2.1. And just FYI I have an extremely basic and limited knowledge of WP, CSS, HTML etc.

Viewing 8 replies - 1 through 8 (of 8 total)

Amin – WPMU DEV Support

(@wpmudev-support2)

11 years, 5 months ago

Hello chickenz,

I’m afraid the code you posted above is not the same with the code rendered on your page.. Could you paste here the code in header.php ?

Best Regards,
Calvin

Thread Starter

chickenz

(@chickenz)

11 years, 5 months ago

Hi,

Sorry for that. The following is for http://pavilioncenter.ro

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" <?php language_attributes(); ?>>

<head profile="http://gmpg.org/xfn/11">

<meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />
<title><?php bloginfo('name'); ?> <?php if ( is_single() ) { ?> » Archive <?php } ?> <?php wp_title(); ?></title>

<meta name="generator" content="WordPress <?php bloginfo('version'); ?>" /> <!-- leave this for stats -->
<!-- Styles  -->
<link rel="stylesheet" type="text/css" href="<?php bloginfo('stylesheet_url'); ?>" />
<link rel="stylesheet" href="<?php bloginfo('template_directory'); ?>/css/print.css" type="text/css" media="print" />
<!--[if IE]><link rel="stylesheet" href="<?php bloginfo('template_directory'); ?>/css/ie.css" type="text/css" media="screen, projection" /><![endif]-->
<link rel="alternate" type="application/rss+xml" title="<?php bloginfo('name'); ?> RSS Feed" href="<?php bloginfo('rss2_url'); ?>" />
<link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />
<?php wp_head();
	$options = get_option('f8_theme_options');
?>
</head>

<body <?php body_class(); ?>>
<div class="container">
<div class="container-inner">

<!-- Begin rss -->

<div class="clear"></div>

<!-- Begin Masthead -->

<div id="mainNav"><a href="http://pavilioncenter.ro/"><img src="http://pavilioncenter.ro/wp-content/uploads/2014/11/logo_centru_basic1.jpg" margin="auto" alt="home"></a>
<div id="lang"><a href="http://pavilioncenter.ro/">RO</a><a href="http://pavilioncenter.ro/en/">EN</a></div>
<div id="fb"><a href="https://www.facebook.com/bucharestbiennial"><img src="/img/fbicon.jpg" alt="Pavilion on Facebook"/></a></div>
<div id="news"><a href="http://www.pavilioncenter.ro/news/"><img src="/img/newsicon.jpg" alt="Pavilion Newsletter" /></a></div></div>

<span class="contact"><?php if ( $options['phone'] != '' ) { ?><?php echo $options['phone']; ?><?php } if ( $options['email'] != '' ) { ?><a>"><?php echo $options['email']; ?></a><?php } ?></span></h4>
</div>

<!-- Begin Navigation -->
<?php f8_theme_nav(); ?>

And the following is for http://pavilioncenter.ro/en, so for the english version of the page

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" <?php language_attributes(); ?>>

<head profile="http://gmpg.org/xfn/11">

<meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />
<title><?php bloginfo('name'); ?> <?php if ( is_single() ) { ?> » Archive <?php } ?> <?php wp_title(); ?></title>

<meta name="generator" content="WordPress <?php bloginfo('version'); ?>" /> <!-- leave this for stats -->
<!-- Styles  -->
<link rel="stylesheet" type="text/css" href="<?php bloginfo('stylesheet_url'); ?>" />
<link rel="stylesheet" href="<?php bloginfo('template_directory'); ?>/css/print.css" type="text/css" media="print" />
<!--[if IE]><link rel="stylesheet" href="<?php bloginfo('template_directory'); ?>/css/ie.css" type="text/css" media="screen, projection" /><![endif]-->
<link rel="alternate" type="application/rss+xml" title="<?php bloginfo('name'); ?> RSS Feed" href="<?php bloginfo('rss2_url'); ?>" />
<link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />
<?php wp_head();
	$options = get_option('f8_theme_options');
?>
</head>

<body <?php body_class(); ?>>
<div class="container">
<div class="container-inner">

<!-- Begin rss -->

<div class="clear"></div>

<!-- Begin Masthead -->
<div id="mainNav"><a href="http://pavilioncenter.ro/"><img src="http://pavilioncenter.ro/wp-content/uploads/2014/11/logo_centru_basic2.jpg" margin="auto"></a></div>
<div id="lang"><a href="http://www.pavilioncenter.ro/">RO</a><a href="http://www.pavilioncenter.ro/en/">EN</a></div>
<div id="fb"><a href="https://www.facebook.com/bucharestbiennial"><img src="/img/fbicon.jpg" alt="Pavilion on Facebook"/></a></div>
<div id="news"><a href="http://pavilioncenter.ro/en/news/"><img src="/img/newsicon.jpg" alt="Pavilion News" /></a></div>

<span class="contact"><?php if ( $options['phone'] != '' ) { ?><?php echo $options['phone']; ?><?php } if ( $options['email'] != '' ) { ?><a>"><?php echo $options['email']; ?></a><?php } ?></span></h4>
</div>

<!-- Begin Navigation -->
<?php f8_theme_nav(); ?>

Amin – WPMU DEV Support

(@wpmudev-support2)

11 years, 5 months ago

Hello,

You accidentally wrapped the other menu items inside the logo’s wrapper.

Simply replace the code of http://pavilioncenter.ro/ with the code you found on this page:
http://pastebin.com/LdST4pHf.

Use child theme for this if you still didn’t do it: http://codex.ww.wp.xz.cn/Child_Themes

Best Regards,
Calvin

Thread Starter

chickenz

(@chickenz)

11 years, 5 months ago

Hi,

thanks for the tip, I have replaced the code and it did solve the wrapper problem, but it still comes out weird, because the buttons in the header should all be in a single horizontal line with the logo. Unfortunately I cannot use a child theme, I don’t have access to FTP. Any other suggestions maybe?

Best regards

Amin – WPMU DEV Support

(@wpmudev-support2)

11 years, 5 months ago

Hello chickenz,

Replace your header with this one( don’t worry just added a class name to an element) : http://pastebin.com/mQ0K0DjG

Add this custom css code using this plugin: https://ww.wp.xz.cn/plugins/simple-custom-css/ since you don’t have access to child theme.

/*CUSTOM CODE*/
.container-inner {
        overflow: hidden;
}

#mainNav {
	float: left;
}

Hope it helps! 🙂

Thanks,
Calvin

Thread Starter

chickenz

(@chickenz)

11 years, 5 months ago

Hi Calvin,

Thanks for the tips, I finally got all the objects in one line.

One problem still persists, I cannot figure out why. The buttons for language selection, Facebook, and News are still hanging around where they shouldn’t be. They should be on the right side of the page and the language button should have RO and EN above each other, not next to each other like they are now.

Thanks a million 🙂

Amin – WPMU DEV Support

(@wpmudev-support2)

11 years, 5 months ago

Hey there chickenz,

Long time no talk. how are you? 🙂

I suggest to put the 3 menu items ( lang, fb, news ) under a div with class name “float-right” so it will look like this:

<div class="float-right">
	<div id="lang">
		<a href="http://pavilioncenter.ro/">RO</a><a href="http://pavilioncenter.ro/en/">EN</a>
	</div>
	<div id="fb">
		<a href="https://www.facebook.com/bucharestbiennial"><img src="/img/fbicon.jpg" alt="Pavilion on Facebook"></a>
	</div>
	<div id="news">
		<a href="http://www.pavilioncenter.ro/news/"><img src="/img/newsicon.jpg" alt="Pavilion Newsletter"></a>
	</div>
</div>

then add this css code:

#lang a {
	display: block;
}

.float-right {
	float: right;
}

Hope it helps! 🙂

Best Regards,
Calvin

Thread Starter

chickenz

(@chickenz)

11 years, 5 months ago

Hi Calvin,

I am good thanks. Hope you are well.

That did it, thanks so much 🙂

All my best

Viewing 8 replies - 1 through 8 (of 8 total)

The topic ‘Problem with site header’ is closed to new replies.

Problem with site header

Tags

Topics

Topics with no replies

Non-support topics

Resolved topics

Unresolved topics

All topics