Wordpress: Add a logo at different position on each page

Question

I want to put a logo in the header of a website. I use the theme "Snowbird". In the header.php I want to specify to Wordpress to place the logo a different place on the header, according to each page of the website.

This is the code I add to my header.php

<!DOCTYPE html>
<!--[if IE 9]>
<html class="ie9" <?php language_attributes(); ?>><![endif]-->
<!--[if gt IE 9]><!-->
<html <?php language_attributes(); ?>><!--<![endif]-->
<head>
<?php wp_head(); ?>
</head>

<body <?php body_class(); ?> itemtype="http://schema.org/WebPage" itemscope="itemscope">

<div class="xf__site hfeed">
   <div class="content-area">
      <div class="logo">
         <a href="#"><img src="https://website/wp-content/uploads/2017/09/logo-website.png" alt="Logo" /></a>
      </div>

How can I do that ?

Best regard, Lordaker

Answer 1

Use the body_class filter to add classes to the body element of specific pages and then use CSS to do the positioning.

PHP - functions.php

function wp_body_classes( $classes ) {
  if ( is_page( 'Demo Page' ) ) {
    $classes[] = 'demo-page';
  }
  return $classes;
}
add_filter( 'body_class', 'wp_body_classes' );

CSS

.demo-page .logo {
   // position
}

Wordpress: Add a logo at different position on each page

Question

1 answers

solution1
0 ACCPTED 2017-09-14 14:55:31

Wordpress: Add a logo at different position on each page

Question

1 answers

solution1 0 ACCPTED 2017-09-14 14:55:31

solution1
0 ACCPTED 2017-09-14 14:55:31