I'm trying to overylay woocommerce product title on its featured image, as i replaced featured image with some plane colored background and on it i need to call woocommerce product title. Please share how can i achieve this ?
if ( has_post_thumbnail() ) {
$html = '<div data-thumb="' . get_the_post_thumbnail_url( $post->ID, 'shop_thumbnail' ) . '" class="woocommerce-product-gallery__image"><a href="' . esc_url( $full_size_image[0] ) . '">';
$html .= get_the_post_thumbnail( $post->ID, 'shop_single', $attributes );
$html .= '</a></div>';
} else {
$html = '<div class="woocommerce-product-gallery__image--placeholder">';
$html .= sprintf( '<img src="%s" alt="%s" class="wp-post-image" />', esc_url( wc_placeholder_img_src() ), esc_html__( 'Awaiting product image', 'woocommerce' ) );
$html .= '<div class="centered">';
$html .= how to call here!!!
$html .= '</div>';
$html .= '</div>';
}
You need to get the product title from the product like this:
$product = wc_get_product( $post->ID );
$title = get_the_title($product->ID);
So your code becomes :
if ( has_post_thumbnail() ) {
$html = '<div data-thumb="' . get_the_post_thumbnail_url( $post->ID, 'shop_thumbnail' ) . '" class="woocommerce-product-gallery__image"><a href="' . esc_url( $full_size_image[0] ) . '">';
$html .= get_the_post_thumbnail( $post->ID, 'shop_single', $attributes );
$html .= '</a></div>';
} else {
$product = wc_get_product( $post->ID );
$title = get_the_title($product->ID);
$html = '<div class="woocommerce-product-gallery__image--placeholder">';
$html .= sprintf( '<img src="%s" alt="%s" class="wp-post-image" />', esc_url( wc_placeholder_img_src() ), esc_html__( 'Awaiting product image', 'woocommerce' ) );
$html .= '<div class="centered">';
$html .= $title ;
$html .= '</div>';
$html .= '</div>';
}
An edit :
Since you are within the loop, you do not need to get the product using the function I used. You can just use the global $product variable if the post is a product.
Related
Hi i enabled the review on woocommerce and doesn't show on products page and i put this code in snippets
function bbloomer_product_reviews_shortcode( $atts ) {
if ( empty( $atts ) ) return '';
if ( ! isset( $atts['id'] ) ) return '';
$comments = get_comments( 'post_id=' . $atts['id'] );
if ( ! $comments ) return '';
$html .= '<div class="woocommerce-tabs"><div id="reviews"><ol class="commentlist">';
foreach ( $comments as $comment ) {
$rating = intval( get_comment_meta( $comment->comment_ID, 'rating', true ) );
$html .= '<li class="review">';
$html .= get_avatar( $comment, '60' );
$html .= '<div class="comment-text">';
if ( $rating ) $html .= wc_get_rating_html( $rating );
$html .= '<p class="meta"><strong class="woocommerce-review__author">';
$html .= get_comment_author( $comment );
$html .= '</strong></p>';
$html .= '<div class="description">';
$html .= $comment->comment_content;
$html .= '</div></div>';
$html .= '</li>';
}
$html .= '</ol></div></div>';
return $html;
}
add_shortcode( 'woocommerce_after_single_product', 'bbloomer_product_reviews_shortcode' );
I checked the enable review to the all products and in woocommerce to and in the discussions
You can add a new tab using the action hook woocommerce_product_tabs. check the below code. code goes in your active theme functions.php file.
add_filter( 'woocommerce_product_tabs', 'woo_custom_product_tabs' );
function woo_custom_product_tabs( $tabs ) {
$tabs['products_review_tab'] = array(
'title' => __( 'Reviews', 'woocommerce' ),
'priority' => 120,
'callback' => 'products_review_tab_content'
);
return $tabs;
}
Now you can echo do_shortcode[] inside products_review_tab_content callback.
function products_review_tab_content() {
global $product;
echo do_shortcode( '[product_reviews_shortcode id="'.$product->id.'"]' );
}
function product_reviews_shortcode( $atts ) {
$atts = shortcode_atts( array(
'id' => ''
), $atts, 'product_reviews_shortcode' );
$comments = get_comments( array(
'post_id' => $atts['id']
) );
if ( ! $comments ) return '';
$html .= '<div class="woocommerce-tabs"><div id="reviews"><ol class="commentlist">';
foreach ( $comments as $comment ) {
$rating = intval( get_comment_meta( $comment->comment_ID, 'rating', true ) );
$html .= '<li class="review">';
$html .= get_avatar( $comment, '60' );
$html .= '<div class="comment-text">';
if ( $rating ) $html .= wc_get_rating_html( $rating );
$html .= '<p class="meta"><strong class="woocommerce-review__author">';
$html .= get_comment_author( $comment );
$html .= '</strong></p>';
$html .= '<div class="description">';
$html .= $comment->comment_content;
$html .= '</div></div>';
$html .= '</li>';
}
$html .= '</ol></div></div>';
return $html;
}
add_shortcode( 'product_reviews_shortcode', 'product_reviews_shortcode' );
Tested and works.
This code working with image and title but post_per_page doesn’t work and trying
number' =>1
is work but if any taxonomy Less than one Or equal to one Info will not be showing.
<?php
$tax = 'studio';
$types = get_terms( array(
'post_per_page' => 1,
)
);
foreach($types as $type) { ?>
<?php
$term_link = get_term_link( $type );
$image = get_field('studio_avatar', 'studio_' . $type->term_id . '' );
if ( has_term( $type->term_id, 'studio')) {
echo '<a class="author author-avt inline" href="' . esc_url( $term_link ) . '">';
echo '<img class="si-user" src="' . $image['url'] . '" /> ';
echo '<span>'. $type->name . '</span>';
echo '</a>';
echo '<span class="posted-on inline">';
echo '<i class="si-clock"></i><time>'. $post_date = get_the_date("j F Y") .'</time>';
echo '</span>';
}
?>
<?php } ?>
I have been working on trying to get this shortcode to show correctly but everything I have tried does not work. Below is my function:
function monster_shortcode( $atts ) {
$monster = $atts['name'];
$query = new WP_Query( array(
'post_type' => 'monsters',
'name' => $monster,
));
if ( $query->have_posts() ) {
while ( $query->have_posts() ) : $query->the_post();
$monster_title = the_title();
$monster_size = the_field('size');
$monster_type = 'type';
$monster_alignment = the_field( 'alignment' );
$monster_ac = the_field( 'armor_class' );
$monster_ac_type = the_field( 'ac_type' );
$monster_hp = the_field( 'hit_points' );
$monster_hd = the_field( 'hit_die' );
$monster_speed = the_field( 'speed' );
$monster_str = the_field( 'str' );
$monster_strb = monster_stats( get_field( 'str' ) );
$monster_dex = the_field( 'dex' );
$monster_dexb = monster_stats( get_field( 'dex' ) );
$monster_con = the_field( 'con' );
$monster_conb = monster_stats( get_field( 'con' ) );
$monster_int = the_field( 'int' );
$monster_intb = monster_stats( get_field( 'int' ) );
$monster_wis = the_field( 'wis' );
$monster_wisb = monster_stats( get_field( 'wis' ) );
$monster_cha = the_field( 'cha' );
$monster_chab = monster_stats( get_field( 'cha' ) );
$monster_saves = the_field( 'saving_throws' );
$monster_skills = the_field( 'skills' );
$monster_dmg = the_field( 'damage_adjustments' );
$monster_senses = the_field( 'senses' );
$monster_lang = the_field( 'languages' );
$monster_cr = the_field( 'cr' );
$monster_actions = the_field( 'actions' );
$monster_reactions = the_field( 'reactions' );
$monster_char = the_field( 'characteristics' );
$monster_content = the_content();
$monster_enviro = the_field( 'enviroments' );
$return = '<h1 class="entry-title">' . $monster_title . '</h1>';
$return .= '<div class="monster-meta">' . $monster_size . ' ' . $monster_type . ', ' . $monster_alignment . '</div>';
$return .= '<ul class="monster-stat">';
$return .= '<li><label>Armor Class</label> ' . $monster_ac . ' (' . $monster_ac_type . ')</li>';
$return .= '<li><label>Hit Points</label> ' . $monster_hp . ' (' . $monster_hd . ')</li>';
$return .= '<li><label>Speed</label> ' . $monster_speed . '</li>';
$return .= '</ul>';
$return .= '<ul class="monster-stat abilities">';
$return .= '<li><label>STR</label>' . $monster_str . ' (' . $monster_strb . ')</li>';
$return .= '<li><label>DEX</label>' . $monster_dex . ' (' . $monster_dexb . ')</li>';
$return .= '<li><label>CON</label>' . $monster_con . ' (' . $monster_conb . ')</li>';
$return .= '<li><label>INT</label>' . $monster_int . ' (' . $monster_intb . ')</li>';
$return .= '<li><label>WIS</label>' . $monster_wis . ' (' . $monster_wisb . ')</li>';
$return .= '<li><label>CHA</label>' . $monster_cha . ' (' . $monster_chab . ')</li>';
$return .= ' </ul>';
$return .= '<ul class="monster-stat">';
$return .= '<li><label>Saving Throws</label> ' . $monster_saves . '</li>';
$return .= '<li><label>Skills</label> ' . $monster_skills . '</li>';
$return .= '<li><label>Damage Adjustments</label> ' . $monster_dmg . '</li>';
$return .= '<li><label>Senses</label> ' . $monster_senses . '</li>';
$return .= '<li><label>Langauage</label> ' . $monster_lang . '</li>';
$return .= '<li><label>Challenge Rating</label> ' . $monster_cr . '</li>';
$return .= '</ul>';
$return .= '<p>' . $monster_traits . '</p>';
$return .= '<h4 class="monster-label">Actions</h2><p>' . $monster_actions . '</p>';
$return .= '<h4 class="monster-label">Reactions</h2><p>' . $monster_reactions . '</p>';
$return .= '<h4 class="monster-label">Characteristics</h2><p>' . $monster_char . '</p>';
$return .= '<h4 class="monster-label">Details</h2><p>' . $monster_content . '</p>';
$return .= '<p><label>Enviroments:</label> ' . $monster_enviro . '</p>';
endwhile;
}
return $return;
wp_reset_postdata();
}
add_shortcode( 'monster', 'monster_shortcode' );
I then put the shortcode [monster name="men-at-arms"] on a page. All the function $variables show up before the post content and all the function html shows where it should be. You can see the output here https://www.dropbox.com/s/xvuqofya1jylsfl/Screenshot%20%283%29.png?dl=0
You're using the display functions instead of the return functions.
the_title() will literally echo the title. If you want it as a variable, you need to use get_the_title() (or you can set the third argument to false in the_title() - but that's generally not desirable)
This applies to all the functions you're using that are outputting a value.
the_title() => get_the_title()
the_field() => get_field()
the_content() => get_the_content()
Since it's now pulling in the hosting post's content, you need to pass the ID from the shortcode to the functions. Either like so:
$monster = $atts['name'];
$monster_id = $atts['id'];
...
$monster_title = get_the_title( $monster_id );
$monster_size = get_field( 'size', $monster_id );
Or like so:
$monster = $atts['name'];
...
$monster_title = get_the_title( $post->ID );
$monster_size = get_field( 'size', $post->ID );
Alternatively, you can remove ALL the variable definitions and just modify the HTML returning portion.
while ( $query->have_posts() ) : $query->the_post(); ?>
<h1 class="entry-title"><?php the_title(); ?></h1>
<div class="monster-meta"><?php the_field('size'); ?> <?php the_field('type'); ?> <?php the_field('alignment'); ?>
<ul class="monster-stat">
...
</div>
<?php endwhile; ?>
I'm having a little hard time here implementing a modal view to display the post content rather than sending the user to another page.
I have this
function get_grid_archive_theme( $post, $archive_template = null ) {
$archive_template = isset( $archive_template ) ? $archive_template : get_product_listing_template();
$return = '';
if ( $archive_template == 'grid' ) {
$product_id = $post->ID;
$excerpt = get_the_excerpt( $product_id );
$post_content = get_the_content( $product_id );
$image_id = get_post_thumbnail_id( $product_id );
$thumbnail_product = wp_get_attachment_image_src( $image_id, 'classic-grid-listing' );
$product_name = get_product_name();
if ( $thumbnail_product ) {
$img_class[ 'alt' ] = $product_name;
$img_class[ 'class' ] = 'classic-grid-image';
$image = wp_get_attachment_image( $image_id, 'classic-grid-listing', false, $img_class );
} else {
$url = default_product_thumbnail_url();
$image = '<img src="' . $url . '" class="classic-grid-image default-image" alt="' . $product_name . '" >';
}
$archive_price = apply_filters( 'archive_price_filter', '', $post );
$classic_grid_settings = get_classic_grid_settings();
$row_class = get_row_class( $classic_grid_settings );
$return = '<div class="col-xs-12 col-sm-6 col-md-3 product-' . $product_id . ' classic-grid ' . $row_class . ' ">';
$return .= '<a data-toggle="modal" data-target="#' . $product_id . ' " href="#">';
//$return .= '<div style="background-image:url(\'' . $url . '\');" class="classic-grid-element"></div>';
$return .= '<div class="classic-grid-image-wrapper"><div class="pseudo"></div><div class="image">' . $image . '</div></div>';
$return .= '<div class="excerpt-cnt"><div class="excerpt-text">' . $excerpt . '</div></div><h3 class="product-name">' . $product_name . '</h3>' . $archive_price;
if ( $classic_grid_settings[ 'attributes' ] == 1 && function_exists( 'product_attributes_number' ) ) {
$attributes_number = product_attributes_number();
if ( $attributes_number > 0 && has_product_any_attributes( $product_id ) ) {
$max_listing_attributes = apply_filters( 'max_product_listing_attributes', $classic_grid_settings[ 'attributes_num' ] );
$return .= '<div class="product-attributes">';
$a = 0;
for ( $i = 1; $i <= $attributes_number; $i++ ) {
$attribute_value = get_attribute_value( $i, $product_id );
if ( !empty( $attribute_value ) ) {
$return .= '<div><span class="attribute-label-listing">' . get_attribute_label( $i, $product_id ) . ':</span> <span class="attribute-value-listing">' . get_attribute_value( $i, $product_id ) . '</span> <span class="attribute-unit-listing">' . get_attribute_unit( $i, $product_id ) . '</span></div>';
$a++;
}
if ( $a == $max_listing_attributes ) {
break;
}
}
$return .= '</div>';
}
}
$return .= '</a>';
$return .= apply_filters( 'classic_grid_product_listing_element', '', $product_id );
$return .= '</div>';
}
$return .= '<div id="' . $product_id . ' " class="modal" role="dialog">';
$return .= '<div class="modal-dialog"><div class="modal-content">';
$return .= '<div class="modal-header">';
$return .= '<h4 class="modal-title">' . $product_name .'</h4>';
$return .= '</div>';
$return .= '<div class="modal-body">';
$return .= '<p>' . $post_content .'</p>';
$return .= '</div>';
$return .= '<div class="modal-footer">';
$return .= '</div>';
$return .= '</div></div>';
$return .= '</div>';
return $return;
}
This code extracts a series of posts excerpts and displays them in a 4 column layout As the picture below depicts
Each one can be clicked and it will show the content of that post in a modal. Well the thing is, it just doesn't but the modal is loaded in the DOM because when I inspect the code there are no JS errors, and the modals are shown in the HTML but still as display:none;. If I click that off or change it to block manually in the web-dev tool the modal shows.
Bootstrap is loaded in the site too. What am I missing? Why doesn't the data-target toggle the display from none to block?
I think there is just a small space problem in your code, in the line below.
$return .= '<div id="' . $product_id . ' " class="modal" role="dialog">';
Remove the space before the close of id attribute, as given below.
$return .= '<div id="' . $product_id . '" class="modal" role="dialog">';
I hope this will help!
I want to remove the nofollow code from the latest posts displayed in the sidebar. I found that the code which adds rel=nofollow tag to latest post is located here
theme folder/example theme/lib/activity/plugin.php.
Here is the exact code:
private function get_latest_posts( $post_count ) {
// Get the latest posts
$latest_posts = get_posts(
array(
'numberposts' => $post_count,
'order' => 'desc',
'orderby' => 'date'
)
);
// Create the markup for the listing
$html = '<div class="tab-pane" id="recent">';
$html .= '<ul class="latest-posts">';
if( count( $latest_posts ) > 0 ) {
foreach( $latest_posts as $post ) {
$html .= '<li class="clearfix">';
// Add the small featured image
if( has_post_thumbnail( $post->ID ) ) {
$html .= '<a class="latest-post-tn fademe" href="' . get_permalink( $post->ID ) . '" rel="nofollow">';
$html .= get_the_post_thumbnail( $post->ID, array( 50, 50 ) );
$html .= '</a>';
} // end if
$html .='<div class="latest-meta">';
// Add the title
$html .= '<a href="' . get_permalink( $post->ID ) . '" rel="nofollow">';
$html .= get_the_title( $post->ID );
$html .= '</a>';
// Add date posted
// If there's no title, then we need to turn the date into the link
if( strlen( get_the_title( $post->ID ) ) == 0 ) {
$html .= '<a href="' . get_permalink( $post->ID ) . '" rel="nofollow">';
} // end if
$html .= '<span class="latest-date">';
$html .= get_the_time( get_option( 'date_format' ), $post->ID );
$html .= '</span>';
// Close the anchor
if(strlen( get_the_title( $post->ID ) ) == 0 ) {
$html .= '</a>';
} // end if
$html .='</div>';
$html .= '</li>';
} // end foreach
} else {
$html .= '<li>';
$html .= '<p class="no-posts">' . __( "You have no recent posts.", 'standard' ) . '</p>';
$html .= '</li>';
} // end if/else
$html .= '</ul>';
$html .= '</div>';
return $html;
} // end get_latest_posts
Now please tell me how to remove the nofollow tag from this code using the child theme?
Since you have control of the child theme, you can wrap the call to display the widget zone for that widget with something that grabs the output, performs a regex search/replace on it, and outputs the result. I wrote a blog post about that recently:
Filtering the output of WordPress widgets
The basics are that you have a function that replaces dynamic_sidebar() with your own function, like this:
function theme_dynamic_sidebar($index = 1) {
// capture output from the widgets
ob_start();
$result = dynamic_sidebar($index);
$out = ob_get_clean();
// do regex search/replace on $out
echo $out;
return $result;
}
Seems that you are out of luck.
That's a private function and no filter hooks are offered by the theme author.
You may try to override the include('path/to/plugin.php'); and include your own modified version.