Show Custom Site Title or Tagline per Page

to have a custom site title and/or tagline on different pages (static pages only) of your WordPress site;
one possible approach:

/*
* customize different Site Title 
* and Tagline per (static) page
*/

// create meta boxe for 'Custom Site Title' field below page editor

add_action( 'admin_menu', 'custom_site_title' );
add_action( 'save_post', 'save_custom_site_title' );

function custom_site_title() {
	add_meta_box( 'custom_site_title', 'Custom Site Title for this page <small>(if left empty, the general Site Title will be used)</small>', 'custom_site_title_input_function', 'page', 'normal', 'high' );
}

function custom_site_title_input_function() {
	global $post;
	echo '<input type="hidden" name="custom_site_title_input_hidden" id="custom_site_title_input_hidden" value="'.wp_create_nonce( 'custom_site_title-nonce' ).'" />';
	echo '<input type="text" name="custom_site_title_input" id="custom_site_title_input" style="width:100%;" value="'.get_post_meta( $post->ID, '_custom_site_title', true ).'" />';
}

function save_custom_site_title( $post_id ) {
	if (isset( $_POST['custom_site_title_input_hidden'] )) if (!wp_verify_nonce($_POST['custom_site_title_input_hidden'], 'custom_site_title-nonce')) return $post_id;
	if (defined('DOING_AUTOSAVE') && DOING_AUTOSAVE) return $post_id;
	if (isset( $_POST['custom_site_title'] )) {
		$customSiteTitle = $_POST['custom_site_title_input'];
		update_post_meta( $post_id, '_custom_site_title', $customSiteTitle );
	}
}

// create meta boxe for 'Custom Tagline' field below page editor

add_action( 'admin_menu', 'custom_site_tagline' );
add_action( 'save_post', 'save_custom_site_tagline' );

function custom_site_tagline() {
	add_meta_box( 'custom_site_tagline', 'Custom Tagline for this page <small>(if left empty, the general Tagline will be used)</small>', 'custom_site_tagline_input_function', 'page', 'normal', 'high' );
}

function custom_site_tagline_input_function() {
	global $post;
	echo '<input type="hidden" name="custom_site_tagline_input_hidden" id="custom_site_tagline_input_hidden" value="'.wp_create_nonce( 'custom_site_tagline-nonce' ).'" />';
	echo '<input type="text" name="custom_site_tagline_input" id="custom_site_tagline_input" style="width:100%;" value="'.get_post_meta( $post->ID, '_custom_site_tagline', true ).'" />';
}

function save_custom_site_tagline( $post_id ) {
	if (isset( $_POST['custom_site_tagline_input_hidden'] )) if (!wp_verify_nonce($_POST['custom_site_tagline_input_hidden'], 'custom_site_tagline-nonce')) return $post_id;
	if (defined('DOING_AUTOSAVE') && DOING_AUTOSAVE) return $post_id;
	if (isset( $_POST['custom_site_tagline'] )) {
		$customSiteTagline = $_POST['custom_site_tagline_input'];
		update_post_meta( $post_id, '_custom_site_tagline', $customSiteTagline );
	}
}

//preparing the output

add_filter( 'bloginfo', 'custom_site_title_tagline_output', 2, 10 );

function custom_site_title_tagline_output( $site_bloginfo, $show ) {
	global $post;
	if( $show == 'name' && is_page() && get_post_meta( $post->ID, '_custom_site_title', true ) ) {
		$site_bloginfo = get_post_meta( $post->ID, '_custom_site_title', true );
	}
	if( $show == 'description' && is_page() && get_post_meta( $post->ID, '_custom_site_tagline', true ) ) {
		$site_bloginfo = get_post_meta( $post->ID, '_custom_site_tagline', true );
	}
	return $site_bloginfo;
}

add the code to functions.php of your theme; could also be made into a plugin as it is not theme dependant.
might also change meta title and/or tagline; not tested for interference with seo plugins.
code in pastebin https://pastebin.com/n9Xd5uZg

Better Gallery Alignment in Twenty Seventeen

The new theme Twenty Seventeen shows the right thumbnail image in the default 3-column gallery with just a little space to its right,  which is particular noticable when you post a full width image directly above or below the gallery.

To have clear left and right lines in your site, add this CSS to your theme, either into style.css of a child theme, or into the ‘Appearance – Customize – Additonal CSS’:

/*aligning 3-column gallery*/

.gallery-item {
  margin-right: 4%;
  padding-right: 0;
  width: 48%;
}
.gallery-item:nth-child( 2n ) {
  margin-right: 0;
}
@media screen and (min-width: 30em) {
  .gallery-columns-3 .gallery-item {
    padding-right: 0;
    width: 31.5%;
    margin-right: 2.75%;
  }
  .gallery-columns-3 .gallery-item:nth-child( 3n ) {
    margin-right: 0;
  }
}

If you want to change the gallery to show one column only in narrow browsers such as mobile phones, change the CSS to this variation:

/*aligning 3-column gallery - variation*/

.gallery-item {
  padding-right: 0;
  width: 100%;
}
@media screen and (min-width: 22em) {
  .gallery-item {
    margin-right: 4%;
    padding-right: 0;
    width: 48%;
  }
  .gallery-item:nth-child( 2n ) {
    margin-right: 0;
  }
}
@media screen and (min-width: 30em) {
  .gallery-columns-3 .gallery-item {
    padding-right: 0;
    width: 31.5%;
    margin-right: 2.75%;
  }
  .gallery-columns-3 .gallery-item:nth-child( 3n ) {
    margin-right: 0;
  }
}

Showing the Content of the ‘Posts Page’ before all Posts

If you have set a static front page, and defined a ‘posts page’, WordPress will use the index template to show the list of posts.
This also means that any content you might have entereed into the ‘posts page’ will not get shown.

Make sure to add any content before you set the page as the ‘posts page’; otherwise the editor will not be shown, and a warning message will be displayed instead.

To show this content of the ‘posts page’ before the list of posts, you can use following code (to be inserted into functions.php of a child theme, the html structure of the example below is based on Twenty Fourteen):

function page_content_on_posts_page() {
if( get_option( 'page_for_posts' ) && is_home() ) {
global $wp_query;
if( !is_paged() && $wp_query->current_post == 0 ) { ?>
<article id="post-<?php echo get_option( 'page_for_posts' ); ?>" class="<?php echo implode(  ', ', get_post_class( 'posts-page-content', get_option( 'page_for_posts' ) ) ); ?>">

<div class="entry-content">
<?php
echo apply_filters( 'the_content', get_post( get_option( 'page_for_posts' ) )->post_content );
?>
</div><!-- .entry-content -->
</article><!-- #post-## -->
<?php }
}
}

add_action( 'the_post', 'page_content_on_posts_page' );

 

 

Adding Widgets Between Posts in the Index Page

For a child theme of the (current) default theme Twenty Fifteen – a way to add a new sidebar aka widget area to show after the first post in the index page; making use of the action hook ‘the_post’.

/* WIDGET AREAS aka SIDEBARS INBETWEEN POSTS IN LOOP OF INDEX PAGE */

add_action( 'after_setup_theme', 'twentyfifteen_child_setup' );

function twentyfifteen_child_setup() {
add_action( 'widgets_init', 'twentyfifteen_child_widgets_init' );
add_action( 'the_post', 'twentyfifteen_child_inter_posts_sidebars' );
}

//register sidebar for inbetween posts

function twentyfifteen_child_widgets_init() {

	register_sidebar( array(
		'name' => __( 'First Inter-Posts Widget Area ', 'twentyfifteen' ),
		'id' => 'inter-posts-1',
		'description'   => __( 'Add widgets here to appear between post 1 and 2 in your index page.', 'twentyfifteen' ),
		'before_widget' => '<aside id="%1$s" class="widget inter-post-widget %2$s">',
		'after_widget'  => '</aside>',
		'before_title'  => '<h2 class="widget-title">',
		'after_title'   => '</h2>',
	) );

}

//widget output between posts in index page

function twentyfifteen_child_inter_posts_sidebars() {
	global $wp_query;
	if( is_home() && $wp_query->current_post == 1 ) {
		dynamic_sidebar( 'inter-posts-1' );
	}
	
}

you will need to create your own CSS based on the CSS class .inter-post-widget …

example:

.inter-post-widget { 
	margin: 20px 8.33%;
	padding: 3%;
	width: auto;
}