Site Title and a Logo at the same time?

Hey Ric

Good to hear from you again.

As you’ve probably guessed this isn’t possible from within regular theme settings. I’ve got a child theme for you, it’s mostly ready to go.

1. Where should the site title be positioned relative to the logo?
2. Are you using the sticky header? If so, must both be included in the sticky header?

Hi Ric

Thanks for your feedback.

All WordPress themes overwrite when updating. As a result it’s important to not make any changes to theme files. What we ideally need to do now is move your style.css changes over to Simple Custom CSS plugin. That will free you up to run the next Ultra update when it ships. I’ll try help with that.

1. Install Simple Custom CSS: https://wordpress.org/plugins/simple-custom-css/
2. Go to Appearance > Custom CSS and insert:

/* Container Width */

.container {
  max-width: 960px;
}

/* Site Branding Container */

.site-header .site-branding-container {
	max-width: 60%;
}

/* Main Menu Container */

.main-navigation {
  max-width: 40%;
}

/* Site Title */

.site-header .site-branding h1.site-title {
	font-size: 2.3em;
	font-family: TimesNewRoman, 'Times New Roman', Times, Baskerville, Georgia, serif;
}

These are the modifications you’ve mentioned. If you’ve made other changes, they will also need to be stored at Appearance > Custom CSS.

I’ll get that child theme ready for you now.

I’m in Cape Town, South Africa at GMT+2. I’m here as much as possible 🙂 Let me know if anything else comes up.

Hi Andrew,

I also have a same request but I need to put the logo before the title and tegline.
I am using ultra theme with the ultra child theme.
Could you guide me please what I should change.

Thanks in advance,

Fen

Hi Andrew,

Many thanks for your quick response and solution.
Unfortunately when I use your new code, the logo on top and the tile show under the logo not beside the logo.
Is that possible create like table, logo on the left column 1, and title one column 2 row 1 and tagline on column 2 row 2
So the logo and title+tagline will be display side by side.

Thanks again for your help.
I really like your theme, its simple and elegant.

Fen.

Hi Andrew,

By modified the style.css, now I cant see the tile, it only display picture + (empty, no title) and under the picture the tagline.
My page title actually a bit long, so I add the code below using custome CSS:
.site-header .site-branding-container {
max-width: 65%;
}

/* Main Menu Container */
.main-navigation {
max-width: 35%;
}

Not sure if that impact the other or not.

Thanks,

Fen

Thanks for the update. My style.css now look as follows:

/* Site Header */

.site-header .site-branding a,
.site-header .site-branding .site-title-wrapper {
	display: inline-block;
	vertical-align: middle;
}

.site-header .site-branding a {
	margin-right: 10px;
}

.site-header .site-branding-container {
	max-width: 70%;
}

/* Main Menu */

.main-navigation {
	max-width: 30%;
}

My header.php site branding container div looks as follows, note the new wrapper I added:

			<div class="site-branding-container">
				<div class="site-branding">
					<a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home">
						<?php ultra_display_logo(); ?>
					</a>	
					<div class="site-title-wrapper">		
						<h1 class="site-title"><a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a></h1>
						<?php if( get_bloginfo('description') && siteorigin_setting('header_tagline') ) : ?>
							<h2 class="site-description"><?php bloginfo( 'description' ); ?></h2>
						<?php endif; ?>
					</div><!-- .site-title-wrapper -->
				</div><!-- .site-branding -->
			</div><!-- .site-branding-container -->

Let me know how that goes.