I'm trying to change the header logo on my site, depending on the page the person is on. I don't know PHP, but I've found where the Logo is defined in header.php, and am trying to rewrite it to be dynamic. When I use my code, the site breaks, so obviously I'm doing something wrong.
Here is the code of my header.php file.
<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head><meta charset="<?php bloginfo( 'charset' ); ?>">
<!-- Set the viewport width to device width for mobile -->
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.8.7/chosen.css" integrity="sha256-0LjJurLJoa1jcHaRwMDnX2EQ8VpgpUMFT/4i+TEtLyc=" crossorigin="anonymous" />
<?php
wp_head();
?>
<style>
.chosen-container .chosen-results {
height: 100%;
overflow-y: hidden;
max-height: inherit;
}
.chosen-container-active .chosen-single, .chosen-container-single .chosen-single {
display: none;
}
.chosen-container-single .chosen-drop {
display: contents;
}
</style>
</head>
<body <?php body_class(); ?>>
<div class="<?php $themnific_redux = get_option( 'themnific_redux' );
if (empty($themnific_redux['tmnf-uppercase'])) {} else {if($themnific_redux['tmnf-uppercase'] == '1') echo 'upper '; }
if (empty($themnific_redux['tmnf-bottombar-dis'])) {} else {if($themnific_redux['tmnf-bottombar-dis'] == '1') echo 'bottombar_dis '; }
if ( is_active_sidebar( 'tmnf-sidebar' ) ) {echo 'tmnf-sidebar-active ';} else { echo 'postbarNone ';};
if (empty($themnific_redux['tmnf-header-layout'])) {} else {echo esc_attr($themnific_redux['tmnf-header-layout']);}
?>">
<div id="header" class="tranz" itemscope itemtype="http://schema.org/WPHeader">
<div class="container_head">
<a class="screen-reader-text ribbon skip-link" href="#content_start"><?php esc_html_e('Skip to content','citygov');?></a>
<div class="clearfix"></div>
<div id="titles" class="tranz2">
<?php if(empty($themnific_redux['tmnf-main-logo']['url'])) { ?>
<h1 class="logo"><?php bloginfo('name');?></h1>
<?php }
else { ?>
<a class="logo" href="<?php echo esc_url(home_url('/')); ?>">
<img class="tranz" src="<?php echo esc_url($themnific_redux['tmnf-main-logo']['url']);?>" alt="<?php bloginfo('name'); ?>"/>
</a>
<?php } ?>
</div><!-- end #titles -->
<div class="header-right for-menu">
<input type="checkbox" id="showmenu" aria-label="<?php esc_html_e('Open Menu','citygov');?>">
<label for="showmenu" class="show-menu ribbon" tabindex="0"><i class="fas fa-bars"></i> <span><?php esc_html_e('Menu','citygov');?></span></label>
<nav id="navigation" class="rad tranz" itemscope itemtype="http://schema.org/SiteNavigationElement" role="navigation" aria-label="<?php esc_html_e( 'Main Menu', 'citygov' ); ?>">
<?php get_template_part('/includes/navigation'); ?>
</nav>
</div><!-- end .header-right -->
<div class="clearfix"></div>
<div id="bottombar" class="bottomnav tranz" role="navigation" aria-label="<?php esc_html_e( 'Quick Links', 'citygov' ); ?>">
<?php if(empty($themnific_redux['tmnf-menu-label'])) {} else { ?>
<p class="menu_label"><?php echo esc_attr($themnific_redux['tmnf-menu-label']); ?></p>
<?php }?>
<div class="header-right">
<?php get_template_part('/includes/add-navigation'); ?>
<?php get_template_part('/includes/uni-social' );?>
</div>
</div><!-- end #bottombar -->
<div class="clearfix"></div>
</div><!-- end .container -->
</div><!-- end #header -->
<?php ?>
<div class="wrapper p-border">
You can do this by simply put below code in your theme's functions.php file.
after putting this code, you can now see the new settings added into back-end admin area.
Go to the wordpress admin area then go to Appearance > Customize > Site Identity.
You can now see there are two new settings.
1)Upload Logo (replaces text) => You can add second logo for other pages
2) Page IDs. => You can add comma separated page ids in this text box for displaying second logo in that pages.
function jay_customize_register( $wp_customize ) {
$wp_customize->add_setting( 'jay_logo' );
$wp_customize->add_control( new WP_Customize_Image_Control( $wp_customize, 'jay_logo', array(
'label' => __( 'Upload Logo (replaces text)', 'jay' ),
'section' => 'title_tagline',
'settings' => 'jay_logo',
) ) );
$wp_customize->add_setting('page_ids');
$wp_customize->add_control('text_setting', array(
'label' => 'Page IDs',
'section' => 'title_tagline',
'type' => 'text',
'settings' => 'page_ids',
));
}
add_action( 'customize_register', 'jay_customize_register' );
function change_logo_on_single($html) {
$pageIDs = (get_theme_mod('page_ids'))? explode(',',get_theme_mod('page_ids')) : array();
if(in_array(get_the_ID(),$pageIDs)){
$html = preg_replace('/<img(.*?)\/>/', '<img src="'.get_theme_mod('jay_logo').'" class="custom-logo" alt="" itemprop="logo" />', $html);
}
return $html;
}
add_filter('get_custom_logo','change_logo_on_single');
Related
I'm building a website using understrap-child theme.
What I would like to achieve is my navbar logo (added through Appearance -> Customize) to change into another one when scrolling the page.
In functions.php I've already added a section in order to be able to add a second logo, which I've successfully added in the Appearance -> Customize section.
Here's the code in functions.php:
//ADDING NEW LOGO FIELD
function your_theme_customizer_setting($wp_customize) {
// add a setting
$wp_customize->add_setting('your_theme_hover_logo');
// Add a control to upload the hover logo
$wp_customize->add_control(new WP_Customize_Image_Control($wp_customize, 'your_theme_hover_logo', array(
'label' => 'Upload Hover Logo',
'section' => 'title_tagline', //this is the section where the custom-logo from WordPress is
'settings' => 'your_theme_hover_logo',
'priority' => 8 // show it just below the custom-logo
)));
}
add_action('customize_register', 'your_theme_customizer_setting');
get_theme_mod( 'your_theme_hover_logo' );
Now that I have two logos set, I would like to know how to replace the first logo with the second one when scrolling my page.
Here's my header.php section with the navbar:
<!-- ******************* The Navbar Area ******************* -->
<div id="wrapper-navbar">
<a class="skip-link sr-only sr-only-focusable" href="#content"><?php esc_html_e( 'Skip to content', 'understrap' ); ?></a>
<nav id="main-nav" class="navbar navbar-expand-md navbar-dark fixed-top" aria-labelledby="main-nav-label">
<h2 id="main-nav-label" class="sr-only">
<?php esc_html_e( 'Main Navigation', 'understrap' ); ?>
</h2>
<?php if ( 'container' === $container ) : ?>
<div class="container">
<?php endif; ?>
<!-- Your site title as branding in the menu -->
<?php if ( ! has_custom_logo() ) { ?>
<?php if ( is_front_page() && is_home() ) : ?>
<h1 class="navbar-brand mb-0"><a rel="home" href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" itemprop="url"><?php bloginfo( 'name' ); ?></a></h1>
<?php else : ?>
<a class="navbar-brand" rel="home" href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" itemprop="url"><?php bloginfo( 'name' ); ?></a>
<?php endif; ?>
<?php } else {
the_custom_logo();
} ?><!-- end custom logo -->
Please notice that I've already added a Query in order to change the navbar background color when scrolling...and that works!
</script>
<script>jQuery(window).scroll(function(){
jQuery('nav').toggleClass('scrolled', jQuery(this).scrollTop() > 80);
});</script>
with its CSS rules:
#media (min-width: 992px) {
.navbar.scrolled {
background-color: $secondary;
border-bottom: solid rgba(37, 36, 36, 0.055);
I really hope you can help me solve my problem!
THANK YOU SO MUCH!!
When someone visits a specific page in my WordPress website, I want to show a full screen iframe of another website over it. It has to cover my webpage fully, so it looks almost as if the user is on another website now (url will still be of mine).
How can I do that? Is there maybe a plugin for that?
P. S. I know how to code, but I've never developed anything on WordPress. Please be specific :)
EDIT:
Trying to put iframe on header.php:
<?php
/**
* The header for our theme.
*
* This is the template that displays all of the <head> section and everything up until <div id="content">
*
* #link https://developer.wordpress.org/themes/basics/template-files/#template-partials
*
* #package staymore
*/
?><!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(); ?>>
<?php
// When user visits http://my-website.com/privacy-policy
if(is_page('privacy-policy'))
{?>
<iframe src="http://google.com" style="position:fixed; top:0px; left:0px; bottom:0px; right:0px; width:100%; height:100%; border:none; margin:0; padding:0; overflow:hidden; z-index:999999;">
Your browser doesn't support iframes
</iframe>
<?}
?>
<div id="page" class="site">
<a class="skip-link screen-reader-text" href="#content"><?php esc_html_e( 'Skip to content', 'staymore' ); ?></a>
<header id="masthead" class="site-header" role="banner">
<div class="wrap">
<div class="site-branding">
<h1 class="site-title"><?php bloginfo( 'name' ); ?></h1>
<?php
$description = get_bloginfo( 'description', 'display' );
if ( $description || is_customize_preview() ) : ?>
<p class="site-description"><?php echo $description; /* WPCS: xss ok. */ ?></p>
<?php
endif; ?>
</div><!-- .site-branding -->
<button class="menu-toggle" aria-controls="primary-menu" aria-expanded="false"></button>
<nav id="site-navigation" class="main-navigation" role="navigation">
<?php wp_nav_menu( array( 'theme_location' => 'primary', 'menu_id' => 'primary-menu' ) ); ?>
</nav><!-- #site-navigation -->
</div>
</header><!-- #masthead -->
<div class="site-banner">
<!-- #Header-image -->
<?php if ( get_header_image() ) : ?>
<a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home">
<img src="<?php header_image(); ?>" width="<?php echo esc_attr( get_custom_header()->width ); ?>" height="<?php echo esc_attr( get_custom_header()->height ); ?>" alt="">
</a>
<?php endif; // End header image check. ?>
</div>
<div id="content" class="site-content">
<div class="wrap">
It is quite easy, first please check the page by placing one of the conditional tag in your header.php file:
<?php
// When Page 42 (ID) is being displayed.
if (is_page( 42 ))
{ ?>
<iframe src="https://www.w3schools.com/html/html_iframe.asp" frameborder="0" scrolling="yes" seamless="seamless" style="display:block; width:100%; height:100vh;"></iframe>
<?php } ?>
You can also use page name or slug in this conditional tag:
if (is_page('Contact')) {iframe code here}
or
if(is_page('about-us'))
Here is the code for my header.php:
<?php
/**
* The header for our theme
*
* This is the template that displays all of the <head> section and everything up until <div id="content">
*
* #link https://developer.wordpress.org/themes/basics/template-files/#template-partials
*
* #package WordPress
* #subpackage Twenty_Seventeen
* #since 1.0
* #version 1.0
*/
?><!DOCTYPE html>
<html <?php language_attributes(); ?> class="no-js no-svg">
<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">
<meta name="p:domain_verify" content="17fc715173fc8410e543997f613a71ce"/>
<?php wp_head(); ?>
</head>
<body <?php body_class(); ?>>
<div id="page" class="site">
<a class="skip-link screen-reader-text" href="#content"><?php _e( 'Skip to content', 'twentyseventeen' ); ?></a>
<header id="masthead" class="site-header" role="banner">
<?php if ( has_post_thumbnail() && ( is_single() || ( is_home() || ( is_page() && ! twentyseventeen_is_frontpage() ) ) ) ) : ?>
<span class="has-header-image twentyseventeen-front-page home">
<div id="page-header" class="custom-header">
<div id="custom-header-media" class="custom-header-media" >
<div id="wp-custom-header" class="wp-custom-header">
<?php if ( is_home() && ! twentyseventeen_is_frontpage() ) {
$page_for_posts = get_option( 'page_for_posts' );
echo get_the_post_thumbnail( $page_for_posts );
} else {
the_post_thumbnail( 'twentyseventeen-featured-image' );
} ?>
</div>
</div>
<div class="site-branding">
<div class="wrap">
<div class="site-branding-text">
<h1 class="site-title">
<?php if ( is_home() && ! twentyseventeen_is_frontpage() ) {
$page_for_posts = get_option( 'page_for_posts' );
echo get_the_title( $page_for_posts );
} else {
the_title();;
} ?>
</h1>
</div>
</div>
</div>
<?php echo twentyseventeen_get_svg( array( 'icon' => 'arrow-right' ) ); ?><span class="screen-reader-text"><?php _e( 'Scroll down to content', 'twentyseventeen' ); ?></span>
</div>
</span>
<?php else : get_template_part( 'template-parts/header/header', 'image' ); endif;?>
<?php if ( has_nav_menu( 'top' ) ) : ?>
<div class="navigation-top">
<div class="wrap">
<?php get_template_part( 'template-parts/navigation/navigation', 'top' ); ?>
</div><!-- .wrap -->
</div><!-- .navigation-top -->
<?php endif; ?>
</header>
<?php
// If a regular post or page, and not the front page, show the featured image.
if ( has_post_thumbnail() && ( is_single() || ( is_page() && ! twentyseventeen_is_frontpage() ) ) ) :
echo '<div class="single-featured-image-header">';
the_post_thumbnail( 'twentyseventeen-featured-image' );
echo '</div><!-- .single-featured-image-header -->';
endif;
?>
<div class="site-content-contain">
<div id="content" class="site-content">
The header tag is set to take each page's featured image and make it full size in that page's header. I set the height of each image to 400px and the width to 100%. I am now trying to make the page title appear centered over the featured header image. Can I take the page title and move it over the header image and center it? Can I make the page title text transparent and add new centered text over the header image? If yes to either or both, how do I go about doing this?
Here is the link to my site, and the page I am currently working on.
This is the desired header format I am trying to achieve.
could you add a css rule for .entry-title class
.entry-title{
position: absolute;
top: -200px;
text-align: center;
width: 100%;
left: 0;
font-size: 50px;
color: white;
}
this is valid the rule should apply to all your .entry-title and the header image is same dimension in each page
I've been trying to turn my simple html/css site into a wordpress site. my big issue which no one seem to be able to solve appears in my footer. The footer is pretty much ignoring everything and just staying in the top of the site ( like it was a part of my header). All my files is split into 3 files. A header.php a footer.php and the page.php (one for each site).
Header!
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" <?php language_attributes(); ?>>
<head profile="http://gmpg.org/xfn/11">
<meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />
<?php if (is_search()) { ?>
<meta name="robots" content="noindex, nofollow" />
<?php } ?>
<title>
<?php
if (function_exists('is_tag') && is_tag()) {
single_tag_title("Tag Archive for ""); echo '" - '; }
elseif (is_archive()) {
wp_title(''); echo ' Archive - '; }
elseif (is_search()) {
echo 'Search for "'.wp_specialchars($s).'" - '; }
elseif (!(is_404()) && (is_single()) || (is_page())) {
wp_title(''); echo ' - '; }
elseif (is_404()) {
echo 'Not Found - '; }
if (is_home()) {
bloginfo('name'); echo ' - '; bloginfo('description'); }
else {
bloginfo('name'); }
if ($paged>1) {
echo ' - page '. $paged; }
?>
</title>
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" />
<link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />
<?php if ( is_singular() ) wp_enqueue_script( 'comment-reply' ); ?>
<?php wp_head(); ?>
</head>
<body <?php body_class(); ?>>
<div id="Menu" ></div>
<div id="Mainbody">
<div id="Portfolio"><?php bloginfo('name'); ?> </div>
<div id="Slogan"><?php bloginfo('description'); ?></div>
<div id="nav-menu">
<?php $defaults = array(
'theme_location' => '',
'menu' => '',
'container' => 'div',
'container_class' => 'menu-{menu slug}-container',
'container_id' => '',
'menu_class' => 'menu',
'menu_id' => '',
'echo' => true,
'fallback_cb' => 'wp_page_menu',
'before' => '',
'after' => '',
'link_before' => '',
'link_after' => '',
'items_wrap' => '<ul id="%1$s" class="%2$s">%3$s</ul>',
'depth' => 0,
'walker' => ''
); ?>
<?php wp_nav_menu( $defaults ); ?>
</div>
<div class="Box">
<div id="Mainindhold">
page!
<?php get_header(); ?>
<div id="Arbejde">
<h2>Uddrag af mine webdesigns</h2>
<br />
<br />
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<?php $key='link'; $custom = get_post_meta($post->ID, $key, true); ?>
<?php $key2='brugt'; $custom2 = get_post_meta($post->ID, $key2, true); ?>
<?php $key3='linkexternal'; $custom3 = get_post_meta($post->ID, $key3, true); ?>
<?php $billede = get_the_post_thumbnail($post->ID, 'full'); ?>
<div class="Raekke">
<div class="Arbejds_Billede">
<a href="<?php echo $custom; ?>" rel="lightbox">
<?php print $billede; ?></a>
</div>
<div class="Arbejdsbeskrivelse">
<h3><?php the_title(); ?></h3>
<?php the_content(); ?>
<div id="program">
<img src="<?php echo $custom2; ?>" />
</div>
<div class="Knap"><p>Besøg siden</p>
</div>
</div>
</div>
<div class="clear"></div>
<?php endwhile;
else:
?>
<?php _e('No posts were fond. Sorry!'); ?>
<?php endif; ?>
</div>
<?php get_footer();?>
footer !
</div>
</div>
</div>
<div id="footer">
©<?php echo date("Y"); echo " "; bloginfo('name'); ?> 4000 Roskilde
</div>
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-31920214-1']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
<?php wp_footer(); ?>
</body>
</html>
To be able to see the issue you can go into Tinajohnson.dk and ofcourse look in the top.
You are calling the footer functions twice in your page: first here:
<?php get_footer();?>
and and here again,
<div id="footer">
©<?php echo date("Y"); echo " "; bloginfo('name'); ?> 4000 Roskilde
</div>
get rid of the second piece and it should work.
This is a CSS problem; add the following rules to your #footer's CSS:
position: absolute;
bottom: 0;
width: 100%;
If you want your stick to bottom of browser always. Use Position Fixed not absolute
css will be for your ID footer Div
#footer { position:fixed; bottom:0; width:100%}
I really hope you can help out here.
I'm creating a theme for a client and I have created a custom post type called 'Testimonials' and now I would like to show the testimonials on the home page but I'm having trouble outputting the data for the meta information.
I have created a function in my functions.php file called 'show_testimonials' and I'm calling that in my index.php file (I haven't separated everything in to their constituant parts yet, e.g header.php, footer.php etc). This function is meant to show the posts and meta information from the 'Testimonials' custom post type but it doesn't.
I can see that I am pulling the correct meta data in to my '$meta' variable.
Below is the code for the 'show_testimonials' function.
function show_testimonials() {
$loop = new WP_Query(
array(
'post_type' => 'shv_testimonials',
'order_by' => 'ID',
)
);
if ($loop->have_posts()) {
$output = '<ul class="testimonial-list">';
while($loop->have_posts()) {
$loop->the_post();
$meta = get_post_meta(get_the_id(), '');
print_r($meta);
$output .= '
<li>
<a href="' . get_permalink() . '">
' . get_the_title() . ' | ' .
$meta['shv_testimonial_author'][0] . '
</a>
</li>
';
}
}
return $output;
}
Below is my index.php file.
<!DOCUMENT html>
<!--[if IE 6]>
<html id="ie6" <?php language_attributes(); ?>>
<![endif]-->
<!--[if IE 7]>
<html id="ie7" <?php language_attributes(); ?>>
<![endif]-->
<!--[if IE 8]>
<html id="ie8" <?php language_attributes(); ?>>
<![endif]-->
<!--[if !(IE 6) | !(IE 7) | !(IE) ]><!-->
<html <?php language_attributes(); ?>>
<!--<![endif]-->
<head>
<meta charset="<?php bloginfo('charset');?>" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title>
<?php
global $page, $paged;
wp_title('«', true, 'right');
bloginfo('name');
?>
</title>
<link rel="profile" href="http://gmpg.org/xfn/11" />
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen" />
<link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />
<?php if ( is_singular() && get_option('thread_comments')) wp_enqueue_script('comment-reply'); ?>
<?php wp_enqueue_script('jquery'); ?>
<?php wp_head(); ?>
</head>
<body <?php body_class(); ?>>
<div id="page">
<header id="masthead" role="banner">
<div id="header-strip">
<nav id="secondary-navigation" role="navigation">
<?php wp_nav_menu(array(
'menu' => 'Secondary Navigation',
'container' => false
)); ?>
</nav>
<?php get_search_form(true); ?>
</div>
<div id="branding-nav">
<?php
if (is_front_page()) { ?>
<div id="logo" role="banner">
<img src="<?php echo bloginfo('template_directory') . '/images/logo.png'; ?>" alt="<?php bloginfo('name'); ?>" />
</div>
<?php } else { ?>
<div id="logo" role="banner">
<img src="<?php echo bloginfo('template_directory') . '/images/logo.png'; ?>" alt="<?php bloginfo('name'); ?>" />
</div>
<?php }
?>
<nav id="primary-navigation" role="navigation">
<?php wp_nav_menu(array(
'menu' => 'Primary Navigation',
'container' => false
)); ?>
</nav>
</div>
</header>
<div id="content">
<?php
if(is_front_page()) { ?>
<div id="feature">
<section id="introduction">
<?php
echo "<h1 class='title'>" . $options['shv_introduction_heading'] . '</h1>';
echo "<p class='short-description'>" . $options['shv_introduction_short_description'] . '</p>';
?>
<nav id="call-to-action" role="navigation">
<ul>
<li id="book-now">
Book Now
</li>
<li id="learn-more">
Learn More
</li>
</ul>
</nav>
</section>
<section id="gallery">
</section>
</div>
<?php } else { ?>
<section id="entries">
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<article id="post-<?php the_ID(); ?>" <?php post_class(); ?> role="main">
<header>
<aside class="post-image">
<?php
if (has_post_thumbnail()) {
the_post_thumbnail();
} else { ?>
<img src="<?php echo get_bloginfo('template_directory') . '/images/no-image.png'; ?>" title="<?php the_title(); ?>" />
<?php }?>
</aside>
<h1 id="post-<?php the_ID(); ?>">
<?php the_title(); ?>
</h2>
<time datetime="YYYY-MM-DD"></time>
</header>
<section class="post-content">
<p><?php echo get_the_excerpt(); ?></p>
Read More
</section>
<section class="meta">
<p><?php the_category(',') ?></p>
<p><?php the_tags(""); ?></p>
</section>
</article>
<?php endwhile; else: ?>
<div class="error">
<h2>Oooops!</h2>
<p>Sorry something went wrong! No posts matched your criteria. Please try again.</p>
</div>
<?php endif; ?>
<?php posts_nav_link(' ⏼ ', __('« Newer Posts'), __('Older Posts »')); ?>
<aside role="sidebar">
<h2>Some Widget in The Sidebar</h2>
</aside>
</section>
<?php } ?>
</div>
<footer role="foottext">
<div id="footer-top">
<section id="social">
<div id="twitter">
<?php show_tweets(); ?>
</div>
<div id="share">
<h2>Share</h2>
<div id="icons">
<a href="http://twitter.com/home?status=Shiverschool Theatre in Education+http://www.shiverschool.co.uk/" title="Tweet About Us">
<img src="<?php echo get_bloginfo('template_directory') . '/images/twitter-share-icon.png'; ?>" alt="Tweet About Us" />
</a>
<a href="http://www.stumbleupon.com/submit?url={http://www.shiverschool.co.uk}&title={Shiverschool Theatre in Education}" title="Recommend us on StumbleUpon">
<img src="<?php echo get_bloginfo('template_directory') . '/images/stumbleupon-share-icon.png'; ?>" alt="Recommend us on StumbleUpon" />
</a>
<a href="http://digg.com/submit?url=http://www.shiverschool.co.uk/" title="Digg Us">
<img src="<?php echo get_bloginfo('template_directory') . '/images/digg-share-icon.png'; ?>" alt="Digg Us" />
</a>
<a href="http://www.facebook.com/sharer.php?u=http://www.shiverschool.co.uk&t=Shiverschool Theatre in Education" title="Recommend us on Facebook">
<img src="<?php echo get_bloginfo('template_directory') . '/images/facebook-share-icon.png'; ?>" alt="Recommend us on Facebook" />
</a>
<a href="https://plusone.google.com/_/+1/confirm?hl=en&url=http://www.shiverschool.co.uk&title=Shiverschool Theatre in Education" title="Recommend us on Google+">
<img src="<?php echo get_bloginfo('template_directory') . '/images/google-share-icon.png'; ?>" alt="Recommend us on Google+" />
</a>
</div>
</div>
</section>
<section id="testimonials">
<div id="testimonial">
<?php show_testimonials(); ?>
</div>
<div id="mascot">
<img src="<?php echo bloginfo('template_directory') . '/images/mascot.png' ?>" alt="Shiverschool Mascot" />
</div>
</section>
</div>
<?php wp_footer(); ?>
</footer>
</div>
</body>
</html>
Here is the full 'functions.php' file.
<?php
// Add JavaScript files
function add_scripts() {
wp_enqueue_script('modernizr_script', get_template_directory_uri() . '/js/modernizr.js', __FILE__);
wp_enqueue_script('global_functions_script', get_template_directory_uri() . '/js/global-functions.js', __FILE__);
}
add_action('wp_enqueue_scripts', 'add_scripts');
// Setup and load the theme options page and related code
require(get_template_directory() . '/inc/theme-options.php');
//Get theme options
$options = get_option('shv_theme_options');
// Add support for custom backgrounds
add_custom_background();
// Add support for post thumbnails and admin bar
add_theme_support('post-thumbnails');
add_theme_support('admin-bar');
// This theme uses wp_nav_menu() in two locations
if (function_exists('register_nav_menus')) {
register_nav_menus(array(
'primary' => 'Primary Navigation',
'secondary' => 'Secondary Navigation'
));
}
/*
* Register custom post types
*/
//Testimonials Post Type
class SHV_Testimonials_Post_Type {
//Create construct function
public function __construct() {
$this->register_post_type();
$this->metaboxes();
}
//Register post type
public function register_post_type() {
$args = array(
'labels' => array(
'name' => 'Testimonials',
'singular_' => 'Testimonial',
'add_new' => 'Add New Testimonial',
'all_items' => 'All Testimonials',
'add_new_item' => 'Add New Testimonial',
'edit_item' => 'Edit Testimonial',
'new_item' => 'New Testimonial',
'view_item' => 'View Testimonial',
'search_items' => 'Search Testimonials',
'not_found' => 'No Testimonials Found',
'not_found_in_trash' => 'No Testimonials Found in Trash'
),
'query_var' => 'testimonials',
'rewrite' => array(
'slug' => 'testimonials',
),
'public' => true,
'supports' => array(
'title'
)
);
register_post_type('shv_testimonials', $args);
}
//Build metaboxes
public function metaboxes() {
//Add new meta boxes testimonial and testimonial author
add_action('add_meta_boxes', 'add_testimonial_meta_box');
add_action('add_meta_boxes', 'add_testimonial_author_meta_box');
//Run add_meta_box functions
function add_testimonial_meta_box() {
add_meta_box('shv_testimonial', 'Testimonial', 'testimonial', 'shv_testimonials');
}
function add_testimonial_author_meta_box() {
add_meta_box('shv_testimonial_author', 'Testimonial Author', 'testimonial_author', 'shv_testimonials');
}
//Create form elements and pull through any data associated with each meta box
function testimonial($post) {
$testimonial = get_post_meta($post->ID, 'shv_testimonial', true); ?>
<p>
<label for="shv_testimonial">Please enter your testimonial</label>
<textarea class="large-text" name="shv_testimonial" id="shv_testimonial" cols="50" rows="5"><?php echo esc_attr($testimonial); ?></textarea>
</p>
<?php }
function testimonial_author($post) {
$author = get_post_meta($post->ID, 'shv_testimonial_author', true); ?>
<p>
<label for="shv_testimonial_author">Please enter a testimonial author name and school, e.g. John Doe, St Ambrose Barlow</label>
<input type="text" class="widefat" name="shv_testimonial_author" id="shv_testimonial_author" value="<?php echo esc_attr($author); ?>" />
</p>
<?php }
//Save meta box input
add_action('save_post', 'save_meta_data');
function save_meta_data($id) {
if (isset($_POST['shv_testimonial'])) {
update_post_meta(
$id,
'shv_testimonial',
strip_tags($_POST['shv_testimonial'])
);
}
if (isset($_POST['shv_testimonial_author'])) {
update_post_meta(
$id,
'shv_testimonial_author',
strip_tags($_POST['shv_testimonial_author'])
);
}
}
}
}
add_action('init', 'register_testimonials');
function register_testimonials() {
new SHV_Testimonials_Post_Type();
}
function show_tweets() { ?>
<img src="<?php echo get_bloginfo('template_directory') . '/images/twitter-bird-icon.png'; ?>" alt="Tweets" />
<?php
//Get theme options
$options = get_option('shv_theme_options');
include_once(ABSPATH . WPINC . '/feed.php');
$username = $options['shv_twitter_username'];
$rss = fetch_feed('https://api.twitter.com/1/statuses/user_timeline.rss?screen_name=' . $username);
if (!is_wp_error( $rss ) ) : // Checks that the object is created correctly
// Figure out how many total items there are, but limit it to 5.
$maxitems = $rss->get_item_quantity(1);
// Build an array of all the items, starting with element 0 (first element).
$rss_items = $rss->get_items(0, $maxitems);
endif;
?>
<ul>
<?php if ($maxitems == 0) echo '<li>No items.</li>';
else
// Loop through each feed item and display each item as a hyperlink.
foreach ( $rss_items as $item ) : ?>
<li>
<a href='<?php echo $item->get_permalink(); ?>'>
<?php echo $item->get_title(); ?>
</a>
</li>
<?php endforeach; ?>
</ul>
<?php }
function show_testimonials() {
$loop = new WP_Query(
array(
'post_type' => 'shv_testimonials',
'order_by' => 'ID',
)
);
if ($loop->have_posts()) {
$output = '<ul class="testimonial-list">';
while($loop->have_posts()) {
$loop->the_post();
$meta = get_post_meta(get_the_id(), '');
print_r($meta);
$output .= '
<li>
<a href="' . get_permalink() . '">
' . get_the_title() . ' | ' .
$meta['shv_testimonial_author'][0] . '
</a>
</li>
';
}
}
return $output;
}
?>
Here's a link to the development site where you can see that I'm outputting the correct meta data using 'print_r($meta);'. http://dev.garethdaine.com/shiverschool
I hope someone can point me in the right direction. Cheers in advance.
The output of show_testimonials is just not printed anywhere, try echo show_testimonials() in your template or echo $output; instead of return $output; in your show_testimonials function.