Home>Support>Building new home page concept on existing site

Building new home page concept on existing site

Greetings, I want to develop a new home page concept on an active site running Vantage Premium. There will be considerable changes to the formatting of the masthead (maybe not the best idea, but there it is). I can handle the CSS. Seems to me that the best thing to do is pull a copy of Pagebuider home page template into my existing child theme, renaming it to create a new template. Then I can supply a name parameter in get_header to point to a new renamed header.php (created from the existing one), and insert my new style sheet there.

The issue is I’m not totally certain how the default style.css is inserted, or where to put the new style sheet reference. My code is:

<head>
	<meta charset="<?php bloginfo( 'charset' ); ?>" />
	<meta http-equiv="X-UA-Compatible" content="IE=10" />
	<title><?php wp_title( '|', true, 'right' ); ?></title>
	<link rel="profile" href="http://gmpg.org/xfn/11" />
	<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>" />
	<?php wp_head(); ?>
</head>

The call to bloginfo returns only the charset. Am I really missing something here? Can you suggest a better way to do it? Much thanks!
-Steve
Note: not much to see on current site its working great!

URL: http://www.wontok.com

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 9 years, 6 months ago Andrew Misplon
    Hi, I Work Here

    Hi sitemech

    Thanks for reaching out. I’ll try break your question up into a few points, hopefully making it easier to work through.

    Page Templates
    The “Page Builder Home” page template is really just a “Full Width – No Page Title” page template. There isn’t too much else going on there. If you need to customise page templates, that’s 100%. Just make a copy and insert into your child theme.

    Child Theme Structure

    I think it’ll be best if you get going with our vanilla child theme. It’s setup and ready to go:

    https://siteorigin.com/wp-content/uploads/2015/01/vantage-child-vanilla-enqueue.zip

    When it comes to CSS, all you need to do there is start adding your own custom styles to the style.css file of the child theme. Everything else is ready to go.

    Let me know if that makes sense, we’ll go from there.

  2. 9 years, 6 months ago sitemech

    Andrew, great stuff, thanks. I’m still a bit mystified, I want/need to have a page running in an existing WordPress space with an active site, and it needs to have an entirely different masthead layout (logo, navigation, search bar social icons etc.). So I need a page with it’s own named template and it’s own style sheet so I don’t mess up the running site with it’s existing child theme. That’s why I want to know how to properly insert a style sheet above into the header.php code.

    Hopefully I’m making sense this time. Sorry for any confusion.
    -Steve

  3. 9 years, 6 months ago Andrew Misplon
    Hi, I Work Here

    I’m with you now. We can try help with this but it might be a little beyond what we’re currently capable of supporting.

    You’d need to do this from within your existing child theme.

    1. Different logo. I’ve just gone of this quite extensively with another client here:
    Thread: Change header image on one page only

    2. Menu: You’ll need to register a new menu in the functions.php file of your child theme and then call that in the related theme part: http://codex.wordpress.org/Function_Reference/register_nav_menus

    3. Search: Not sure what you want to do here, the search functionality will natively search the whole site. You can of course style things differently on that page.

    4. Social Icons: This is pretty easy, you can use Jetpack Widget Visibility to decide which widgets to show on which pages.

    Hopefully that gets you going in the right direction.

  4. 9 years, 6 months ago Andrew Misplon
    Hi, I Work Here

    It isn’t necessary to load a separate stylesheet, you could just target the same ID’s/classes as you normally would but prefix everything with body class of the page you’re working with.

    If you do want to load a new stylesheet then you’d need to enqueue it from the functions.php file in your child theme:

    http://codex.wordpress.org/Function_Reference/wp_enqueue_style

  5. 9 years, 6 months ago sitemech

    This looks right, let me see how far I get. Thanks!

  6. 9 years, 6 months ago Andrew Misplon
    Hi, I Work Here

    For sure :)

  7. 9 years, 6 months ago sitemech

    I think I have the rest of it figured out except where you mention “call that (menu) in the related theme part. I thought that part was going to be easy, but I think I’ve been through almost every Vantage theme file now, and for the life of me I can’t see where the primary menu gets built into the masthead, so I can NOT call it and insert my new one.
    -Steve

  8. 9 years, 6 months ago Andrew Misplon
    Hi, I Work Here

    So assuming you were using a entirely new menu for this page, what I’d do in the functions.php file of my child theme is:

    1. Register the new menu, this is how it looks in the parent theme, it must of course be different in the child theme:

    	// This theme uses wp_nav_menu() in one location.
    	register_nav_menus( array(
    		'primary' => __( 'Primary Menu', 'vantage' ),
    	) );
    

    Codex: http://codex.wordpress.org/Function_Reference/register_nav_menus

    2. Then, we need to call this menu in your child theme, in the related theme part:

    This is the example from the parent theme:

    <?php wp_nav_menu( array( 'theme_location' => 'primary', 'link_before' => '<span class="icon"></span>' ) ); ?>
    

    Codex: http://codex.wordpress.org/Function_Reference/wp_nav_menu

    Using conditionals you might not even need to create entirely new theme parts. You could just make a “parts” folder in the child theme, copy menu.php into that folder and then use a is_page() conditional:

    http://codex.wordpress.org/Conditional_Tags

    Hopefully this helps.

  9. 9 years, 6 months ago sitemech

    Andrew, thanks for this, I had managed to figure out the mods to functions.php, I appreciate the verify.

    The wp-nav-menu code string you detail appears in only one place in the parent theme that I have found, the file parts/masthead-logo-in-menu.php. Is that the related theme part you are referring to? I see what you are saying about an is-page conditional, that should be no issue.

  10. 9 years, 6 months ago Andrew Misplon
    Hi, I Work Here

    In both /parts/menu.php and /parts/masthead-logo-in-menu.php the menu is used, just depends on what layout you have running.

    In order for you to have a new menu for this page I’m imagining you create that in functions.php and then call it /part/menu.php. So you could say, if is my custom page, call my custom menu, else, load the regular menu. if – else.

    The introduction of Ubermenu compatibility and also a new setting allowing sticky on mobile has complicated /parts/menu.php. To see a simplified version you could download an older version of the theme and use that instead:

    https://themes.svn.wordpress.org/vantage/

    In summary, what I’d try for is a conditional in the menu file that says if it’s my custom page ID then load my custom menu, else load the regular Vantage menu.

  11. 9 years, 6 months ago sitemech

    Good stuff Andrew, I'll see if I can get that to work. Cheers, and have a great day.

  12. 9 years, 6 months ago Andrew Misplon
    Hi, I Work Here

    For sure, you too. Just shout if you run into a problem.

Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More