I have a WordPress blog, but I am also hosting a standalone static HTML page on the same domain/server (LaughingSquid, if it makes a difference). I'm very new to WordPress and PHP, so I am wondering if there is a relatively simple way to use PHP to add the topbar that appears in my WordPress-based pages to the static HTML page. Is this possible and how would you go about doing it? Thanks.

  • Are you talking about the standard logged in WordPress toolbar, or the menu bar (with Home, Contact, Resume and Search) that you already have on the WP site? Jan 11 '14 at 1:28
  • I'm referring to the latter. Jan 11 '14 at 1:40

You must require the WordPress Blog Header as per the Codex.


Paste this at the top of your standalone page and then try querying your WPDB.



You can create a custom page template file for your theme which consists of your HTML page markup. You will need to include your topbar, hopefully it is in your header.php template file in which case you can use <?php get_header(); ?> to include it. Then when you add your page you will be able to select this custom template. There is no other easy way of doing this.

Take a look at the WordPress codex.

Your custom page will look like this:

Template Name: Fullscreen 
get_header(); ?>  

<div id="map">
    ... Rest of html

<script src="http://maps.google.com/maps/api/js?v=3.2&amp;sensor=false"></script>
<script src="http://maps.gstatic.com/intl/en_us/mapfiles/api-3/13/15/main.js" type="text/javascript"></script>
<script src="http://libs.cartocdn.com/cartodb.js/v3/cartodb.js"></script>

function init(){
  cartodb.createVis('map', 'http://justmytwospence.cartodb.com/api/v2/viz/e8fd87d0-78b3-11e3-a9e9-e7941b6e2df0/viz.json'); }

<?php get_footer(); ?>

You will also need to enqueue the stylesheet in your theme's functions.php file.

wp_enqueue_style( 'carto-theme', 'http://libs.cartocdn.com/cartodb.js/v3/themes/css/cartodb.css' ); ?>
  • Hi A5hleyRich, I've attempted what you describe, creating a file called "fullscreen-template.php" in my child-theme's folder. It begins with this: <?php /* Template Name: Fullscreen */ <?php get_header(); ?> Followed by the original HTML, but nothing loaded. I then tried removing the outer html tags, but no change. I can provide the full page if you'd like, but does it sound like anything obvious? Jan 11 '14 at 1:53
  • You have a syntax error. Try <?php /* Template Name: Fullscreen */ get_header(); ?> You will also need to add <?php get_footer(); ?> at the end of your html.
    – A5hleyRich
    Jan 11 '14 at 8:37
  • Ah thanks for pointing out the silly typo. This is the result after fixing that: spencerboucher.com/test It looks like the header is creating a div#page.container that is not playing nice with the html. Am I still able to have a header and body in my html or is this what is causing the problem? Jan 12 '14 at 0:54
  • Like you said you will need to remove the html, head and body tags. You will then need to add any additional CSS or JS in WordPress.
    – A5hleyRich
    Jan 12 '14 at 9:34

You can add a page directly from the wordpress admin. This page will have the same layout of the rest of your blog.

If you need more info, you can check here.

Hope it helps.

  • Thanks for the response André, but thats not what I need. The HTML page (link in the question) is a standalone page. If you follow the links I think this should become clear. Jan 11 '14 at 1:16

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.