[Resolved] How to add Carousel to Hompage
Please how can I add this carousel to the homepage of my blog, also to make it such that images will be added as normal post but will show in the carousel list.
So what you want to do is create a text scroller and not an image scroller. Unfortunately, WP Image Carousel only works with images.
Please check this link http://pmnewsnigeria.com/ and scroll down to see the image carousel used. I need something this that.
You can use wpic to create the same sliding effect, but you can’t have the same buttons and captions below the images. So what you want to do is create a carousel somewhere in your homepage that would fetch images automatically from your posts and then display them?
Sure. I will build the code and send you a link to what should be replaced so that it would work.
I’m still expecting the code.
[Please don’t add reminders]
This will take me sometime, because I have to prepare for a test. Check back tomorrow.
The following php code will get the post thumbnails from a category you will specify. Replace AMOUNT with a number (like 5) to change the amount of images you want to show.
Make sure your post thumbnails are all the same size.
Place the following code block in your index.php theme file in the place that you want the image carousel to show (if you need help with this part please let me know).
<?php $the_query = new WP_Query('showposts=AMOUNT&category_name=YOUR_CATEGORY_SLUG'); $text = ""; // The Loop while ( $the_query->have_posts() ) : $the_query->the_post(); $text .= "<a href=\"".get_permalink()."\">".get_the_post_thumbnail(). "</a>\!\n"; endwhile; wp_reset_postdata(); echo do_shortcode('[wpic color="x" visible="x" width="x" height ="x"speed="x" auto="x"]'.$text.'[/wpic]'); ?>
Now find this following code:
echo do_shortcode('[wpic color="x" visible="x" width="x" height ="x"speed="x" auto="x"]'.$text.'[/wpic]');
This code resembles the shortcode settings that you update when you normally use the shortcode in the WordPress post editor. What you need to do is setup your shortcode settings and hit save.
Let me know if this works for you or if you need more help.
You create a post and place it in the category that you specified in the code block. Then you add a feature image to the post and save the post.
I read your posting, and I really appreciate you sharing your problems and more than anything, sharing the solution. I would like to add a moving carousel to my home page. My page is commercialusedtrucks.com I would like to add it under the slider. The problem I am having is that I am using the mantra template and I dont know how to access the area where to add the code in order for the slider to show in the “home” page of the site.
Do you have any suggestions? Thank you so much for all your help and good luck with all your tests. Elizabeth
http://commercialused trucks.com is my website if you can check it out, please? and again I would like a moving carousel with the Feature Images from all the Posts. Again, thank you very much.
From your WordPress dashboard, hover over the Appearance tab and click on the Editor link. From the sidebar at the right, select index.php.
Search (using Control + F) for a piece of code that looks something like this:
Then paste the following code block above it:
<?php $the_query = new WP_Query('showposts=AMOUNT'); $text = ""; // The Loop while ( $the_query->have_posts() ) : $the_query->the_post(); $text .= "<a href=\"".get_permalink()."\">".get_the_post_thumbnail(). "</a>\!\n"; endwhile; wp_reset_postdata(); echo do_shortcode('[wpic color="x" visible="AMOUNT" width="x" height ="x"speed="x" auto="x"]'.$text.'[/wpic]'); ?>
Take note of where you pasted the previous code block, so that you can remove it if this fix doesn’t work for you.
Make sure you change all the x’s to the correct values. Also change where is says AMOUNT (two places) to the amount of images you want to display.
Finally click on Update File.
If you need anymore help let me know.
Thank you so much, it seems to be great, but now I am having another problem.
My pictures are different sizes, some are 1280×960 others 640×480 others 485×375.
For some reason in some posts the 640×480 fits perfectly as a featured image, and then I take a 1280×960 and bring it down to 485×375 and it does not look right under the featured image. It is like too big. Also other big pic’s will fit perfectly in that features image. Why?
The reason for this issue is the repercussion that it has in the carousel.
The pics that fit nicely as a thumbnail in the feature image of the post they display great in the carousel.
The pics that for some reason that I cant figure out dont fit right as a thumbnail in the feature image dont display correctly in the carousel and take a whole row, vs, that square size that I input 80×60.
I compared the dimensions, file type etc under the media properties of two different pics, the one that fits nicely vs the one that does not and I cant figure out the difference.
After this long explanation, any ideas???? I am running out of them and I think it is in the specs of the the images.
Hi, I uploaded smaller pictures and placed them in the “featured image”
But I do have a couple of problems.
1- The carousel is not looping or moving, why?
2- Some of the code is showing, why?
3- It displays the pictures in two lines vs in one line, why?
4- The feature images even though they dont show properly in the edit area of the posting, they do properly in the page for Categories (Light, Medium, Heavy) Why are they adjusted in that area but not in the carousel.
Anyway, I appreciate any answers. Maybe some of them are to time consuming, so I understand if you dont, but the main questions are 1, 2 & 3. I will leave the website that way so you can see it.
Thank you and have a happy 4th!!!
- The topic ‘[Resolved] How to add Carousel to Hompage’ is closed to new replies.