Customizing WordPress header – part 2

This is not a proper tutorial, but an additional hint about WP customization.

In the previous part I told you how to create a custom WP header. Following that tutorial you should be able to create your own custom header.

But obviously every blog has a custom header. How to differentiate from the masses?

How about having a different header for every category in our WP blog? Without installing any plugin? (I made the last question because I don’t know if there is already a plugin doing this job, but anyway it may be useful learning how to do it on your own)

Let’s start preparing the background images.

For this example, I am using those two backgrounds, one for the “default” pages, one for the pages about Flash.

Backgrounds

Now it’s time to edit the file header.php located into your wp-content/themes/theme_name directory.

This is how to change what I coded in the first part


Line 1: Check if I am in the Flash archive. The function single_cat_title displays or returns the category title for the current page and has two arguments: the first is the text to output before the category title, the second is a boolean value that displays the category title if true, or return it if false. In my case, I have no text (because I don’t want to output anything) and I set to false the second argument because I need to retrieve the result of the function. This result is checked to see if it’s “Flash” (the name of the category I want to change the header).

Line 2: Header to show if I am in the Flash archive page

Line 3: If I am not in the Flash archive, I need to determine if I am in a single page categorized as a Flash page. That’s why I am using the in_category function. It returns true if the current post is in the specified category. Unfortunately this function only accepts the category id as it is stored in our WP database, so I cannot write in_category("Flash"). I need to write in_category(5). Why did I write “5”? Because 5 is the internal id of my Flash category. You can see your internal category id in your WP admin under Manage->Categories.

And here I had a complication. I experimented that in_category returns true if in the page there is at least one post filed into the selected category. This means that in my homepage, or wherever I should have a “Flash” post (or even an excerpt), I have a “true” value.

Since I want the header to appear only in single pages, I invoke the is_single() function. This function returns true if any single post page is being displayed. So if it’s a single page and it’s a Flash page…

Line 4: Show flash header, like in line 2

Line 5: If I am not in a case mentioned above….

Line 6: Show default header

Now, I just have to write the css for my new flash header, so I have to open the style.css located in the same directory of header.php and add this code

#header_flash{	
	margin: 0px auto;
	width: 1000px;
	color: #fff;
	height: 200px;
	background: url(images/flash_header.png);
}

#header_flash a{
	color:#fff;
	text-decoration:none;
}

#header_flash h1 {
	color: #fff;
	border: none;
	font: normal 24pt verdana;
	padding-left:230px;
	padding-top:50px

}

That is the same of the one I wrote in part 1 except line 6 that displays my alternative background.

That’s all. You can navigate my blog and you’ll see the new header when you browse Flash content.

A bit of patience, and you can have a custom header for every category.

I like WP… see you soon with another tip.

Get the most popular Phaser 3 book

Through 202 pages, 32 source code examples and an Android Studio project you will learn how to build cross platform HTML5 games and create a complete game along the way.

Get the book

214 GAME PROTOTYPES EXPLAINED WITH SOURCE CODE
// 1+2=3
// 100 rounds
// 10000000
// 2 Cars
// 2048
// A Blocky Christmas
// A Jumping Block
// A Life of Logic
// Angry Birds
// Angry Birds Space
// Artillery
// Astro-PANIC!
// Avoider
// Back to Square One
// Ball Game
// Ball vs Ball
// Ball: Revamped
// Balloon Invasion
// BallPusher
// Ballz
// Bar Balance
// Bejeweled
// Biggification
// Block it
// Blockage
// Bloons
// Boids
// Bombuzal
// Boom Dots
// Bouncing Ball
// Bouncing Ball 2
// Bouncy Light
// BoxHead
// Breakout
// Bricks
// Bubble Chaos
// Bubbles 2
// Card Game
// Castle Ramble
// Chronotron
// Circle Chain
// Circle Path
// Circle Race
// Circular endless runner
// Cirplosion
// CLOCKS - The Game
// Color Hit
// Color Jump
// ColorFill
// Columns
// Concentration
// Crossy Road
// Crush the Castle
// Cube Jump
// CubesOut
// Dash N Blast
// Dashy Panda
// Deflection
// Diamond Digger Saga
// Don't touch the spikes
// Dots
// Down The Mountain
// Drag and Match
// Draw Game
// Drop Wizard
// DROP'd
// Dudeski
// Dungeon Raid
// Educational Game
// Elasticity
// Endless Runner
// Erase Box
// Eskiv
// Farm Heroes Saga
// Filler
// Flappy Bird
// Fling
// Flipping Legend
// Floaty Light
// Fuse Ballz
// GearTaker
// Gem Sweeper
// Globe
// Goat Rider
// Gold Miner
// Grindstone
// GuessNext
// Helicopter
// Hero Emblems
// Hero Slide
// Hexagonal Tiles
// HookPod
// Hop Hop Hop Underwater
// Horizontal Endless Runner
// Hundreds
// Hungry Hero
// Hurry it's Christmas
// InkTd
// Iromeku
// Jet Set Willy
// Jigsaw Game
// Knife Hit
// Knightfall
// Legends of Runeterra
// Lep's World
// Line Rider
// Lumines
// Magick
// MagOrMin
// Mass Attack
// Math Game
// Maze
// Meeblings
// Memdot
// Metro Siberia Underground
// Mike Dangers
// Mikey Hooks
// Nano War
// Nodes
// o:anquan
// One Button Game
// One Tap RPG
// Ononmin
// Pacco
// Perfect Square!
// Perfectionism
// Phyballs
// Pixel Purge
// PixelField
// Planet Revenge
// Plants Vs Zombies
// Platform
// Platform game
// Plus+Plus
// Pocket Snap
// Poker
// Pool
// Pop the Lock
// Pop to Save
// Poux
// Pudi
// Pumpkin Story
// Puppet Bird
// Pyramids of Ra
// qomp
// Quick Switch
// Racing
// Radical
// Rebuild Chile
// Renju
// Rise Above
// Risky Road
// Roguelike
// Roly Poly
// Run Around
// Rush Hour
// SameGame
// SamePhysics
// Save the Totem
// Security
// Serious Scramblers
// Shrink it
// Sling
// Slingy
// Snowflakes
// Sokoban
// Space Checkers
// Space is Key
// Spellfall
// Spinny Gun
// Splitter
// Spring Ninja
// Sproing
// Stabilize!
// Stack
// Stick Hero
// String Avoider
// Stringy
// Sudoku
// Super Mario Bros
// Surfingers
// Survival Horror
// Talesworth Adventure
// Tetris
// The Impossible Line
// The Moops - Combos of Joy
// The Next Arrow
// Threes
// Tic Tac Toe
// Timberman
// Tiny Wings
// Tipsy Tower
// Toony
// Totem Destroyer
// Tower Defense
// Trick Shot
// Tunnelball
// Turn
// Turnellio
// TwinSpin
// vvvvvv
// Warp Shift
// Way of an Idea
// Whack a Creep
// Wheel of Fortune
// Where's my Water
// Wish Upon a Star
// Word Game
// Wordle
// Worms
// Yanga
// Yeah Bunny
// Zhed
// zNumbers