Hey!
I am building a site with Toolset Layouts and wanted to deign the whole page, including footer and header, with Toolset Layouts.
To make this possible, ive adjusted the themes php files for different page scenarios (eg single.php) to just display content made by Layouts.
For Reference:
<?php
/**
* Template Name: Clean Page
* This template will only display the content you entered in the page editor
*/
?>
<html <?php language_attributes(); ?> class="no-js">
<head>
<meta charset="<?php bloginfo( 'charset' ); ?>">
<meta name="viewport" content="width=device-width, initial-scale=1">
<?php wp_head(); ?>
</head>
<body>
<?php
while ( have_posts() ) : the_post();
the_content();
endwhile;
?>
<?php wp_footer(); ?>
</body>
</html>
------------
While this worked great for the most part, enabling me to full customize my page, I am now trying to integrate Woocommerce onto the site and ran into a problem:
Designing a layout for single (and archive) Woocommerce sites works fine, but the whole Content is once agained framed in the original (and for the most part deactivated) GeneratePress theme:
hidden link
I have Woocommere views installed and activated the single product page to use the WooCom Views plugins default single page.
How can I prevent this from happening?
I would like to have only the content displayed, without any theme around it; which php-files do I have to edit, or is there a better way to do it?
Greetings!
(I have provided you with access infos to our set up staging site, it is a recent copy of the original site and can be edited freely. Please note that the original site isnt life and still in development, the staging site has been setup for this support request)
Here's some additional documentation for developing Layouts-based themes:
https://toolset.com/documentation/user-guides/develop-layouts-based-themes/#php-integration-for-layouts
The trick to having the layout show up is to use this function:
It should replace the loop. If you don't want to include the shop header and shop footer elements, you can replace those calls with wp_head and wp_footer, respectively. So I have something like this in my single product template file:
<?php
/**
* The Template for displaying all single products
*
* @see https://docs.woocommerce.com/document/template-structure/
* @author WooThemes
* @package WooCommerce/Templates
* @version 1.6.4
*/
if ( ! defined( 'ABSPATH' ) ) {
exit; // Exit if accessed directly
}
wp_head(); ?>
<?php
/**
* woocommerce_before_main_content hook.
*
* @hooked woocommerce_output_content_wrapper - 10 (outputs opening divs for the content)
* @hooked woocommerce_breadcrumb - 20
*/
do_action( 'woocommerce_before_main_content' );
?>
<?php the_ddlayout(); ?>
<?php
/**
* woocommerce_after_main_content hook.
*
* @hooked woocommerce_output_content_wrapper_end - 10 (outputs closing divs for the content)
*/
do_action( 'woocommerce_after_main_content' );
?>
<?php
/**
* woocommerce_sidebar hook.
*
* @hooked woocommerce_get_sidebar - 10
*/
do_action( 'woocommerce_sidebar' );
?>
<?php wp_footer();
/* Omit closing PHP tag at the end of PHP files to avoid "headers already sent" issues. */
This kind of seems to work. The site only loads the post content (and with that the header and footer because they are part of the parent layout, so far everything is correct), but above the normal post content, the "post image" in thi case the product image, get rendered above the post content. Also, some of the css/js (eg hovering the product image) doesn't seem to work anymore.
Nevermind, I kind of found a way to do it by removing the "woocommerce-before-content" and "after-content". Obviously the origial wc styling is lost, but that seems reasonable and we can rebuild our own css.
Thanks for your help, it is much appreciated!