Hallo everyone,
I was improving my website in collab with my friend and I’m creating a full-width title for blog, posts and pages above the content and below the toolbar. There are many website with this capabilities and I think it is very good.
I hope to be not offensive in regard to the SiteOrigin crew if I post some additional personal code, instead I hope this can be useful for the community as the community it has been for me :)
This is the file “header.php” in your child theme:
<?php
/**
* The Header for our theme ver 1.1.
* New version by Khappa MJ (www.khappa.com)
*
* Added: full-width title bar
*
* Displays all of the <head> section and everything up till <div id="main">
*
* @package vantage
* @since vantage 1.0
* @license GPL 2.0
*/
?><!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
<meta charset="<?php bloginfo( 'charset' ); ?>" />
<meta http-equiv="X-UA-Compatible" content="IE=10" />
<link rel="profile" href="http://gmpg.org/xfn/11" />
<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>" />
<?php wp_head(); ?>
</head>
<body <?php body_class(); ?>>
<?php do_action('vantage_before_page_wrapper') ?>
<div id="page-wrapper">
<?php do_action( 'vantage_before_masthead' ); ?>
<?php if( ! siteorigin_page_setting( 'hide_masthead', false ) ) : ?>
<?php get_template_part( 'parts/masthead', apply_filters( 'vantage_masthead_type', siteorigin_setting( 'layout_masthead' ) ) ); ?>
<?php endif; ?>
<?php do_action( 'vantage_after_masthead' ); ?>
<?php vantage_render_slider() ?>
<!-- Big full-width title before content(by Khappa) -->
<?php if ( the_title( '', '', false ) && siteorigin_page_setting( 'page_title' ) ) : ?>
<?php
$ptitle = the_title();
//if ( $ptitle == '') {
//} elseif ($a == $b) {
//} else {
//}
?>
<div class="entry-title-wrapper">
<h1 class="entry-title"><?php the_title(); ?></h1>
</div>
<?php endif; ?>
<?php do_action( 'vantage_before_main_container' ); ?>
<div id="main" class="site-main">
<div class="full-container">
<?php do_action( 'vantage_main_top' ); ?>
and this is the CSS style of the new titlebar
/* ------------ FULL-WIDTH TITLE ----------- */
.entry-title-wrapper {
background-color: rgba(255, 255, 255, 1.0);
height: 98px;
}
Hi Max,
It’s absolutely fine if you post this stuff here. Ideally though, I would recommend posting a gist though as it’ll allow you to make future adjustments.
To those reading this post – be sure that you create a child theme instead of directly editing the core templates.
Hi Alex, thanks for your reply!
Of course Im working on a child-theme, and all these changement can be done in a child theme as well.
Thank you, I dont use GitHub.
Anyway, hope this code cna be helpful for somebody else :)