Header Clickable

Door Erik Jonge op 20-03-2017 13:38 gewijzigd op 20-03-2017 14:12

1.440 views

Beste Forumleden,

Allereerst zal ik me even kort voorstellen. Ik ben Erik, nieuw op dit forum. Ik doe het beheer van de website www.lightningleiden.nl
Deze wordpress site draait op thema Rookie.

Nu wil ik graag de header clickable maken, zodat wanneer je op de banner klikt op de homepage uit komt.

Wie kan me helpen?

Via appearance-editor-header.php krijg ik het volgende scherm.


<?php
/**
 * The header for our theme.
 *
 * Displays all of the <head> section and everything up till <div id="content">
 *
 * @package Rookie
 */
?><!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
<meta charset="<?php bloginfo( 'charset' ); ?>">
<meta name="viewport" content="width=device-width, initial-scale=1">
<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(); ?>>
<div class="sp-header"><?php do_action( 'sportspress_header' ) ; ?></div>
<div id="page" class="hfeed site">
	<a class="skip-link screen-reader-text" href="#content"><?php _e( 'Skip to content', 'rookie' ); ?></a>

	<header id="masthead" class="site-header" role="banner">
		<?php rookie_header_area(); ?>
	</header><!-- #masthead -->

	<div id="content" class="site-content">
		<?php do_action( 'rookie_before_template' ); ?>

- Ariën -

20-03-2017 14:23 gewijzigd op 20-03-2017 14:23

Je kan op lijn 25 gebruik maken van een <a href="/">...</a> waar je rookie_header_area() functie tussen staat.
Ik raad wel aan om een child-theme te maken bovenop je Rookie-theme. Zo voorkom je dat bij een update van de theme jouw wijziging weer wordt teruggedraaid.

Erik Jonge

20-03-2017 15:39

Beste Arien,

Bedankt voor de tip en het opschonen van de post.

Zou je iets specifieker kunnen zijn?
- Moet ik regel 25 vervangen?
- Op de puntjes moet http://www.etc.nl komen te staan?

Alvast bedankt voor de hulp

- Ariën -

20-03-2017 15:45

Je bent bekend met de werking van een <a href="">-element?

Erik Jonge

20-03-2017 21:29

Nee helaas niet, uiteraard leer in het graag

- Ariën -

20-03-2017 21:34 gewijzigd op 20-03-2017 21:35

<a href="/"><?php rookie_header_area(); ?></a>

Ik zou toch maar even verdiepen in wat je precies doet, en hoe HTML werkt.
Je wilt nu iets aanpassen waar je geen weet van hebt, en dat is erg hoog gegrepen.
Zie ook het verhaal over de child-theme. Want misschien is je wijziging straks weer terug gedraaid.

En wat heeft www.etc.nl ermee te maken, die je net noemde?

Ozzie PHP

20-03-2017 22:30

>> En wat heeft www.etc.nl ermee te maken

Dat zal wel de URL naar de homepage zijn ...

- Ariën -

20-03-2017 22:37

Ik zie geen relevantie met een ledenvergadering van een sport en een tekstschrijvers bureau ;-)

Ben van Velzen

20-03-2017 22:44

Natuurlijk wel, om de notulen wat op te fleuren :-)

Erik Jonge

22-03-2017 13:33

Ben van Velzen op 20/03/2017 22:44:43

Natuurlijk wel, om de notulen wat op te fleuren :-)

Hahaha, altijd goed. Over het algemeen zijn het niet de meest drukbezochte evenementen.

Op de puntjes moest inderdaad www.lightningleiden.nl staan.

Ik denk dat ik het maar even laat voor wat het is. Ik had het verzoek gekregen vanuit de marketing zijde om de header clickable te maken, vandaar het verzoek.

Inmiddels de header weer aangepast naar een wedstrijd, mocht je het een keertje leuk vinden om te komen in Leiden, zijn jullie uiteraard welkom:)

[size=xsmall]Toevoeging op 22/03/2017 13:54:49:[/size]

Aanvullend, ik heb de code ingevoerd en het werkt, het enige is dat er verschil komt in de menubalk. De homebutton blijft in het midden staan en de rest zakt een regel.

Marlies Maalderink

22-03-2017 14:49 gewijzigd op 22-03-2017 15:10

Ik zou het ook niet op die manier oplossen.

Wat je wilt is dit:


<a href="http://www.lightningleiden.nl"><img class="site-banner-image" src="http://www.lightningleiden.nl/wp-content/uploads/cropped-Game-Day-2017-Lightning-Spijkenisse-Scouts-Banner.gif" alt="American Football Club Lightning Leiden"></a>

Maar


<?php rookie_header_area(); ?>

Bestaat uit veel meer code dan alleen de banner, het hele menu valt eronder. Dit is een theme dingetje en is denk ik niet makkelijk op te lossen tenzij er in je wordpress admin area bij theme options een mogelijkheid zit om een link aan de banner te koppelen. Je zou dan moeten zoeken onder thema's -> customizer.

[size=xsmall]Toevoeging op 22/03/2017 15:09:39:[/size]

Overigens als je het echt graag wilt en je ziet het niet zitten om een child theme aan te maken, probeer dit eens:

open template-tags.php in de map inc in je theme folder en zoek op regel 68 dit stukje code:



<div class="site-banner">
     <img class="site-banner-image" src="<?php header_image(); ?>" alt="<?php bloginfo( 'description' ); ?>">
</div><!-- .site-banner -->

Verander dit in:



<div class="site-banner">
     <a href="<?php echo esc_url( home_url( '/' ) ); ?>"><img class="site-banner-image" src="<?php header_image(); ?>" alt="<?php bloginfo( 'description' ); ?>"></a>
</div><!-- .site-banner -->

Dat zou moeten werken... Nu mag je alleen nooit meer je theme updaten want dan is het weer weg.

Reageren

Inloggen om te reageren