I search many slider for post to show.I want to create slider exact as
http://kent.co.in/ features slider which show the post.I am using carousel slider plugin but the expected output is not showing.Thanks
You can pass your dynamic post to your slider image.
make an slider category for post
Set featured image with each slider post.
and get post filter by slider category
and pass it to the your slider imagees
// The Query
$the_query = new WP_Query( 'cat=4' ); // lets suppose slider category id is 4
// The Loop
if ( $the_query->have_posts() ) {
echo '<ul>';
while ( $the_query->have_posts() ) {
echo 'your post thumbnail go here';
}
echo '</ul>';
}
Install and activate Soliloquy Slider plugin.
Create an image slider with Soliloquy.
Copy the template tag from Soliloquy Slider Code widget.
Edit the theme's template file and paste the template tag.
Click on the save button.
for more info: https://www.cosmicenergy.in/
Related
I'm building a product catalog website using woocommerce. Everything is fine but Product short description is showing on product snippet hover on Archive page and it's not responsive. I have included the screenshot below.
How can I hide 'short description' on product hover on Archive page? It's showing when I hover on any part of product snippet. thanks!
enter image description here
I tried this code to add short description below product title:
`function webroom_add_short_description_in_product_categories() {
global $product;
$limit = 10;
if ( ! $product->get_short_description() ) return;
?>
<div itemprop="description">
<?php echo apply_filters( 'woocommerce_short_description', $product->get_short_description() ) ?>
</div>
<?php
}
add_action('woocommerce_after_shop_loop_item', 'webroom_add_short_description_in_product_categories', 5);
function remove_image_zoom_support() {
remove_theme_support( 'wc-product-gallery-zoom' );
}
add_action('wp', 'remove_image_zoom_support', 100);
`
And, it's working fine. But it's also showing on product image when I hover. How can I hide it. thanks!
How do I set an image that was uploaded via Advanced Custom Fields as the featured image of that woocommerce product only on the single product page?
This is how I set it up:
Step 1: I created an ACF image field with return format of 'Image Array'. Here's a screenshot of the settings.
ACF Image field settings
Step 2: I created conditional rules to only display the ACF input field on products for a specific category. That works. In the screen shot below you can see the field on the product page with an image uploaded to it.
ACF Image field on product page with uploaded image from media library
Step 3: Now this is the part I'm struggling with. I need to replace the woocommerce featured image with the uploaded ACF image when a user views the product page.
The screenshot below shows the product page with the woocommerce featured image but I want to replace that with the ACF image I uploaded in Step 2.
Product page on Front-end shows Woo featured image but I want to replace it with ACF image uploaded in Step 2
So I have the snippets plugin enabled where I can add code to swap the product images on the front-end (product page) but I need help with code please.
Any help will be appreciated, thanks!
I'm using OceanWP with WooCommerce.
In your ACF field set image to return ID or modify the function bellow if you need array or url value.
Add the following function to your active theme functions.php file.
function test($html, $post_thumbnail_id ) {
global $product;
$categories = $product->get_category_ids();
//Change 19 to the category id you need
if (in_array('19', $categories)):
//Change get_field to your field
$post_thumbnail_id = get_field('custom_thumb');
$html = wc_get_gallery_image_html( $post_thumbnail_id, true );
endif;
return $html;
}
add_filter( 'woocommerce_single_product_image_thumbnail_html', 'test',10,2);
The answer from Martin worked great. Here's the final code if anyone needs it. It's modified to fallback onto the default woocommerce featured image if the ACF image field is empty.
function acf_wall_art_feature_image($html, $post_thumbnail_id ) {
global $product;
$categories = $product->get_category_ids();
//Get the category id from admin/products/categories/(category_name) URL
if (in_array('30', $categories)):
//Get_field for ACF field name
$post_thumbnail_id = get_field('wall_art_featured_product_image');
//Fallback to woo featured image if no ACF image is set
if (!$post_thumbnail_id):
return $html;
else:
$html = wc_get_gallery_image_html( $post_thumbnail_id, true );
endif;
endif;
return $html;
}
add_filter( 'woocommerce_single_product_image_thumbnail_html',
'acf_wall_art_feature_image',10,2);
I very new to Woocommerce and Wordpress, I am trying to add a different company logo to each different products in grid but I am not able to do it, I have also tried to find any plugin related to it but I found nothing. Please Friends if you know how to do it do let me Know.
There is the below image of what I am trying to get but not able to :
Click Here for Image
First download the acf plugin then make the image field for wooCommerce product only , After made the image field for products, Try " woocommerce_after_shop_loop_item_title " hook in function.php file ,where you can echo the image field of acf by "get_field" function for ACF. "here is the link : ---- https://www.advancedcustomfields.com/resources/image/".
<?php
// define the woocommerce_after_shop_loop_item_title callback
function action_woocommerce_after_shop_loop_item_title( ) {
// make action magic happen here...
$image = get_field('image'); // ACF field name/slug.
if( !empty($image) ){
?>
<img src="<?php echo $image['url']; ?>" alt="<?php echo $image['alt']; ?>" />
<?php
}
};
// add the action
add_action( 'woocommerce_after_shop_loop_item_title', 'action_woocommerce_after_shop_loop_item_title', 10, 0 );
?>
This will show the image on products ,After that do some styling on that in your theme style.css
If above hook does not work try this hook "woocommerce_after_shop_loop_item",
Thumbnail image is inside Media-Grid plugin -> Grid Builder -> select any grid from grid list ->small thumbnail image in front of 'select an item' drop down list
Thumbnail image not appear online but work fine locally.
Can you please tell me where to start ?
here is image
enter link description here
For cropping thumbnail image, you it would not a proper way to use plugins:
Try with this code, it will helps you for all the rest of thumbnails in your whole site...
Put this code in your function.php file
if ( function_exists( 'add_image_size' ) ) {
add_image_size( 'custom-post-thumb', 140, 140,true );
}
Now use this in your code:
<?php if ( has_post_thumbnail()) : ?>
<?php the_post_thumbnail('custom-post-thumb', array('class' => 'attachment')); // here array('class' => 'attachment') apply if you want to apply class to that anchor tag ?>
<?php endif; ?>
Thanks
I'm trying to display a specific category on a WordPress page using a shortcode. I'm familiar with making a custom page template and calling the category there, however my end users will have to be able to add more categories without creating new page templates for each.
Essentially I'm looking for how to create a shortcode that would call a specific category of posts on a page without creating a custom template or using a plug-in.
Thanks!
Here is a simple example. Modify it as needed.
add_shortcode('catlist', function($atts, $content) {
$atts += array('category' => 1);
$posts = get_posts("category={$atts['category']}");
foreach ($posts as $post) {
echo $post->post_name . '<br />';
}
});
echo do_shortcode('[catlist category=5]');
Look at source code of this plugin - http://wordpress.org/extend/plugins/category-post-shortcode/ and you find the solution (approximately 50 lines of code).