Can I use a custom PHP template?

Custom PHP templates are an option in Tasty Recipes, but they are not maintained by the WP Tasty team. This means that any new features we add to the recipes card (like support for showing videos, etc) will have to be manually updated by you or your theme developer. Templates that are included in the Tasty Recipes plugin will be automatically updated, but we can't do the same thing for custom templates.

 

We recommend using one of the standard Tasty Recipes templates that can be selected in the plugin settings, then making any stylistic changes you like with CSS. You can do really amazing things with CSS that will satisfy most needs.

 

If you really want to use a custom template…

 

Using a custom PHP template can be a bit tricky, and potentially take down your site, so we encourage you to try to make your changes with CSS first, which is much less destructive.

 

If you are going to attempt making changes with PHP, we recommend having a backup of your site. We like to use VaultPress.

 

The Tasty Recipes WordPress plugin has support for automatically using a recipe template from your theme. All you’ll need to do is create a tasty-recipes.php  file in your theme directory, and the plugin will use this template to render your recipe any time the recipe is displayed. Using a child theme? Make sure the template file is in your child theme directory, not the parent theme. Last, but not least, you can copy and paste the default template as a starting point:

 

<?php
/**
 * Default recipe template.
 *
 * @package Tasty_Recipes
 */

$print_view_options = tasty_recipes_get_print_view_options();
?>

<?php echo $recipe_styles; ?>

<h2 class="tasty-recipes-title" data-tasty-recipes-customization="h2-color.color h2-transform.text-transform"><?php echo $recipe_title; ?></h2>
<div class="tasty-recipes-image-button-container">
	<?php if ( ! empty( $recipe_image ) && isset( $print_view_options['images'] ) ) : ?>
		<div class="tasty-recipes-image">
			<?php echo $recipe_image; ?>
		</div>
	<?php endif; ?>
	<div class="tasty-recipes-buttons">
		<?php if ( ! empty( $first_button ) ) : ?>
		<div class="tasty-recipes-button-wrap">
			<?php echo $first_button; ?>
		</div>
		<?php endif; ?>
		<?php if ( ! empty( $second_button ) ) : ?>
		<div class="tasty-recipes-button-wrap">
			<?php echo $second_button; ?>
		</div>
		<?php endif; ?>
	</div>
</div>
<?php if ( ! empty( $recipe_rating_icons ) || ! empty( $recipe_rating_label ) ) : ?>
	<div class="tasty-recipes-rating" data-tasty-recipes-customization="body-color.color">
		<?php if ( Tasty_Recipes\Ratings::is_enabled() ) : ?>
			<a href="#respond">
		<?php endif; ?>
			<?php if ( ! empty( $recipe_rating_icons ) ) : ?>
				<p><?php echo $recipe_rating_icons; ?></p>
			<?php endif; ?>
			<?php if ( ! empty( $recipe_rating_label ) ) : ?>
				<p><?php echo $recipe_rating_label; ?></p>
			<?php endif; ?>
		<?php if ( Tasty_Recipes\Ratings::is_enabled() ) : ?>
			</a>
		<?php endif; ?>
	</div>
<?php endif; ?>

<?php if ( ! empty( $recipe_print_button ) && ! tasty_recipes_is_print() ) : ?>
	<?php echo $recipe_print_button; ?>
<?php endif; ?>

<?php if ( ! empty( $recipe_description ) && isset( $print_view_options['description'] ) ) : ?>
	<div class="tasty-recipes-description" data-tasty-recipes-customization="body-color.color">
		<?php echo $recipe_description; ?>
	</div>
<?php endif; ?>

<?php if ( ! empty( $recipe_details ) ) : ?>
	<div class="tasty-recipes-details" data-tasty-recipes-customization="body-color.color">
		<ul>
			<?php foreach ( $recipe_details as $detail ) : ?>
				<li class="<?php echo esc_attr( $detail['class'] ); ?>"><strong data-tasty-recipes-customization="detail-label-color.color" class="tasty-recipes-label"><?php echo $detail['label']; ?>:</strong> <?php echo $detail['value']; ?></li>
			<?php endforeach; ?>
		</ul>
	</div>
<?php endif; ?>

<?php if ( ! empty( $recipe_ingredients ) ) : ?>
	<div class="tasty-recipes-ingredients">
		<div class="tasty-recipes-ingredients-header">
			<div class="tasty-recipes-ingredients-clipboard-container">
				<h3 data-tasty-recipes-customization="h3-color.color h3-transform.text-transform"><?php esc_html_e( 'Ingredients', 'tasty-recipes' ); ?></h3>
				<?php if ( $copy_ingredients ) : ?>
					<?php echo $copy_ingredients; ?>
				<?php endif; ?>
			</div>
			<div class="tasty-recipes-units-scale-container">
				<?php if ( ! empty( $recipe_convertable ) ) : ?>
					<span class="tasty-recipes-convert-container">
						<span class="tasty-recipes-convert-label"><?php esc_html_e( 'Units', 'tasty-recipes' ); ?></span>
						<?php echo $recipe_convertable; ?>
					</span>
				<?php endif; ?>
				<?php if ( ! empty( $recipe_scalable ) ) : ?>
					<span class="tasty-recipes-scale-container">
						<span class="tasty-recipes-scale-label"><?php esc_html_e( 'Scale', 'tasty-recipes' ); ?></span>
						<?php echo $recipe_scalable; ?>
					</span>
				<?php endif; ?>
			</div>
		</div>
		<div class="tasty-recipes-ingredients-body" data-tasty-recipes-customization="body-color.color">
			<?php echo $recipe_ingredients; ?>
		</div>
		<?php
		/**
		 * Add more information after the ingredient list.
		 *
		 * @var object $recipe The recipe to display.
		 */
		do_action( 'tasty_recipes_card_after_ingredients', $recipe );
		?>
	</div>
<?php endif; ?>

<?php if ( ! empty( $recipe_instructions ) ) : ?>
	<div class="tasty-recipe-instructions">
		<div class="tasty-recipes-instructions-header">
			<h3 data-tasty-recipes-customization="h3-color.color h3-transform.text-transform"><?php esc_html_e( 'Instructions', 'tasty-recipes' ); ?></h3>
			<?php if ( ! empty( $recipe_instructions_has_video ) ) : ?>
			<div class="tasty-recipes-video-toggle-container">
				<label for="tasty-recipes-video-toggle"><?php esc_html_e( 'Video', 'tasty-recipes' ); ?></label>
				<button type="button" role="switch" aria-checked="true" name="tasty-recipes-video-toggle">
					<span><?php esc_html_e( 'On', 'tasty-recipes' ); ?></span>
					<span><?php esc_html_e( 'Off', 'tasty-recipes' ); ?></span>
				</button>
			</div>
		<?php endif; ?>
		</div>
		<div class="tasty-recipes-instructions-body" data-tasty-recipes-customization="body-color.color">
			<?php echo $recipe_instructions; ?>
		</div>
	</div>
<?php endif; ?>

<?php if ( ! empty( $recipe_video_embed ) ) : ?>
	<div class="tasty-recipe-video-embed" id="<?php echo esc_attr( 'tasty-recipe-video-embed-' . $recipe->get_id() ); ?>">
		<?php echo $recipe_video_embed; ?>
	</div>
<?php endif; ?>

<?php
if ( ! empty( $recipe_equipment ) ) :
	?>
	<div class="tasty-recipes-equipment">
		<h3 data-tasty-recipes-customization="h3-color.color h3-transform.text-transform"><?php esc_html_e( 'Equipment', 'tasty-recipes' ); ?></h3>
		<?php echo $recipe_equipment; ?>
	</div>
<?php endif; ?>

<?php if ( ! empty( $recipe_notes ) && isset( $print_view_options['notes'] ) ) : ?>
	<div class="tasty-recipes-notes">
		<h3 data-tasty-recipes-customization="h3-color.color h3-transform.text-transform"><?php esc_html_e( 'Notes', 'tasty-recipes' ); ?></h3>
		<div class="tasty-recipes-notes-body" data-tasty-recipes-customization="body-color.color">
			<?php echo $recipe_notes; ?>
		</div>
	</div>
<?php endif; ?>

<?php do_action( 'tasty_recipes_card_before_nutrition' ); ?>

<?php if ( ! empty( $recipe_nutrifox_embed ) && isset( $print_view_options['nutrition'] ) ) : ?>
	<div class="tasty-recipes-nutrifox">
		<?php echo $recipe_nutrifox_embed; ?>
	</div>
<?php endif; ?>

<?php if ( ! empty( $recipe_nutrition ) && isset( $print_view_options['nutrition'] ) ) : ?>
	<div class="tasty-recipes-nutrition">
		<h3 data-tasty-recipes-customization="h3-color.color h3-transform.text-transform"><?php esc_html_e( 'Nutrition', 'tasty-recipes' ); ?></h3>
		<ul>
			<?php foreach ( $recipe_nutrition as $nutrition ) : ?>
				<li><strong class="tasty-recipes-label" data-tasty-recipes-customization="body-color.color"><?php echo $nutrition['label']; ?>:</strong> <?php echo $nutrition['value']; ?></li>
			<?php endforeach; ?>
		</ul>
	</div>
<?php endif; ?>

<?php if ( ! empty( $recipe_keywords ) ) : ?>
	<div class="tasty-recipes-keywords" data-tasty-recipes-customization="detail-value-color.color">
		<p><em><strong data-tasty-recipes-customization="detail-label-color.color"><?php esc_html_e( 'Keywords', 'tasty-recipes' ); ?>:</strong> <?php echo $recipe_keywords; ?></em></p>
	</div>
<?php endif; ?>

<footer class="tasty-recipes-entry-footer">
	<h3 data-tasty-recipes-customization="footer-heading-color.color h3-transform.text-transform footer-heading.innerText"><?php echo esc_html( $footer_heading ); ?></h3>
	<div data-tasty-recipes-customization="footer-description-color.color footer-description.innerHTML"><?php echo wp_kses_post( $footer_description ); ?></div>
</footer>

<?php if ( tasty_recipes_is_print() && get_post() ) : ?>
	<div class="tasty-recipes-source-link">
		<p><strong class="tasty-recipes-label"><?php esc_html_e( 'Find it online', 'tasty-recipes' ); ?></strong>: <a href="<?php echo esc_url( get_permalink( get_the_ID() ) ); ?>"><?php echo esc_url( get_permalink( get_the_ID() ) ); ?></a></p>
	</div>
<?php endif; ?>

<?php echo $recipe_scripts; ?>

**Again, please note that using a custom PHP template means that any changes we make to the default template within the plugin will not be applied to your recipe template. We may or may not notify members of these changes. It is up to you to make sure that your PHP template stays up to date.

 

The default PHP template registers the Print button outside of the tasty-recipes  div. There are a number of ways to include a print button inside your PHP file wherever you see fit. Below is an example of how we have included a Print and Pin button inside the Bold recipe card template:

 

<?php if ( ! tasty_recipes_is_print() ) : ?>
	<div class="tasty-recipes-buttons">
		<?php
			$print_button = '<div class="tasty-recipes-button-wrap"><a class="button tasty-recipes-print-button tasty-recipes-no-print"';
			$current_post = get_post();
			$print_button .= ' href="' . esc_url( tasty_recipes_get_print_url( $current_post->ID, $recipe->get_id() ) ) . '"><img class="svg-print" src="' . esc_url( get_stylesheet_directory_uri() . '/tr-images/icon-print-white' ) . '.png">Print Recipe</a></div>';
			echo $print_button; ?>
		<div class="tasty-recipes-button-wrap">
			<a class="share-pin button" data-pin-custom="true" href="<?php echo esc_url( add_query_arg( 'url', rawurlencode( get_permalink( $current_post->ID ) ), 'https://www.pinterest.com/pin/create/button/' ) ); ?>"><img class="svg-pinterest" src="<?php echo esc_url( get_stylesheet_directory_uri() . '/tr-images/icon-pinterest-white.png' ); ?>">Pin Recipe</a>
		</div>
	</div>
	<?php endif; ?>
Was this article helpful?

Related Articles

Need Support?

Can't find the answer you're looking for?
Contact Support