Replacing only parts of an archive and single page template of WordPress - wordpress

Question

I am having a bit of trouble here understanding how to do the following. I have searched for weeks now but cannot seem to find what I am looking for.
I have a custom post type 'product' and want to change which template gets loaded for the single product page as well as the archive for the products. I am using the following code to load include and load templates.
add_filter('template_include', function() {
if (is_post_type_archive('product')) {
$templatefilename = 'archive-product.php';
$template = WPVS_PATH . 'templates/' . $templatefilename;
return $template;
}
if ('product' == get_post_type() ){
$templatefilename = 'single-product.php';
$template = WPVS_PATH . 'templates/' . $templatefilename;
return $template;
}
});
The problem I am having is that it replaces the current theme's template instead of just the inner part of the content and archive areas.
Here is what I want to achieve:
Create a custom post type 'product' in a plugin - DONE (Was kinda easy!)
When opening a single product only change the content part. - I can do this with the_content filter hook. Simple enough. Any other suggestions is welcome.
When I go to the archive view for the 'product' custom post type I don't want to have it load the theme's default archive (list) view but instead a grid view from my plugin which I cannot seem to get right. I only want to change the inner part of the template, not the whole page.
I have created this plugin a few weeks ago using only shortcodes which works good but want to see if I can do it without the use of shortcodes by means of creating the custom post type and changing the inner template parts of the current active theme.
Can anybody steer me into the right direction here?
If I create a theme I can do what I am looking for but I want to create this into a plugin instead without adding or making changes to the active theme. The plugin should handle what is needed.
The same issue is discussed here but what I want is to develop something that is theme independent. No changes should be made in theme files and no theme files should be copied to the plugin.
WP - Use file in plugin directory as custom Page Template?

Answer 1

Recently I also had the same problem. Here's how I worked it out.
template_include filter accepts a parameter which is the selected template that you want to override (this what you are missing in your code).
I don't know but sometimes the filter hook need higher priority to work like 9999. But first check if it work with default priority, if don't change it.
I assume your both archive and single product template both have include get_header() and get_footer() which can be used for default selected theme (Or if the theme has different setup, setup accordingly).
This is simplified code:
add_filter('template_include', function($default_template) {
if (is_post_type_archive('product')) {
$templatefilename = 'archive-product.php';
$template = WPVS_PATH . 'templates/' . $templatefilename;
$default_template = $template;
} else if ('product' == get_post_type() ) {
$templatefilename = 'single-product.php';
$template = WPVS_PATH . 'templates/' . $templatefilename;
$default_template = $template;
}
// Load new template also fallback if both condition fails load default
return $default_template;
}, 9999); // set priority, only if not worked with default one

Answer 2

The best option in this case is to provide a shortcode to the user. So they can place it on any page that they want (or that you auto generate). That way you will place your content inside their theme.
Something like this:
add_shortcode( 'slotsl-game', 'embed_game' );
/**
* Print the game
* #return false|string
*/
function embed_game(){
ob_start();
$game = get_post();
include_once SLOTSL_PLUGIN_DIR . 'templates/slotsl-single-game.php';
return ob_get_clean();
}