how to set full width image on top?
-
I downloaded and activated Superhero on my self-hosted WordPress site https://www.vrouwleentje.nl
On the theme homepage on wordpress.com a full width image is shown on top of the blog. I want that too, but I cannot find out how to make an image appear like that. Is this the “featured image” functionality? Where are the settings? There is nothing about in the theme option / customize. If there is a theme manual of FAQ, please point me to it.
I like the fixed header feature! Unlike the Sticky Header plugin, this works with IE11.
-
The WordPress.com Superhero demo shows the slideshow in action.
To use the slideshow on a self-hosted site, you’ll need to install Jetpack first, as the slider relies on its Featured Content module.
Once Jetpack is active:
To set up Superhero’s Featured Content area:
1. Navigate to Appearance → Customize → Featured Content.
2. Enter the name of a tag.
3. Click the “Save” button at the bottom.
4. Create a post with a featured image that’s at least 960px wide.
Note: The featured image will look best at a 2.88:1 width-to-height ratio, and at least 500px tall.
5. Give the post the tag you declared under Appearance → Customize → Featured Content.
6. Repeat steps 4 & 5 for as many posts as you’d like in the slider.You’ll find some information on setting up Superhero here – https://theme.wordpress.com/themes/superhero/ – and in the download’s readme.txt file. I’ll see if we can get the readme doc updated so that the reliance on Jetpack is clearer.
Kaththryn,
Thank you for posting these instructions! I installed and activated Jetpack, but there is still no Featured Content item in Appearance → Customize. What did change is that the preview pane on the right hand is gone. If I click “settings” under Jetpack in the installed plugins list I get an error message: “You do not have sufficient permissions to access this page.”
On my Dashboard home page there is a green banner yelling “Connect to WordPress.com” “Your Jetpack is almost ready! Connect now to enable features like Stats, Likes, and Social Sharing.” Does this mean I need a WordPress.com account to make the plugin work? If I wanted that, I would not be running my own WordPress site…I found another plugin, featured content which is (if I understand it correctly) Jetpack stripped down to just the featured content functionality. This does not require a wordpress.com account.
However the slider appears on top of the post I tagged as featured, not on top of the front page.I have chosen another theme for this specific blog, because I want just a single image on top, not a slideshow.
Hi willemb2,
Does this mean I need a WordPress.com account to make the plugin work?
Jetpack requires a WordPress.com connection only for the modules that need WordPress.com server resources, such as Photon and the spelling/grammar checker.
Featured Content does not require a WordPress.com connection. You can use all modules and features that don’t require a WP.com connection by using Jetpack in development mode, which you can do by adding this line to wp-config.php:
add_filter( 'jetpack_development_mode', '__return_true' );
https://jetpack.me/support/development-mode/
I have chosen another theme for this specific blog, because I want just a single image on top, not a slideshow.
Glad you found a theme that better suits your needs. Good luck with your site!
Kathryn,
We don’t host our own blog (don’t know what that would be called), so how would you do this with that being the situation?
Mother Daughter Tea
mdtmblog1 – you can check out the Superhero setup guide here:
https://theme.wordpress.com/themes/superhero/You won’t need to install Jetpack as its features are already built into WordPress.com!
If your site is on WordPress.com, you can get help in their forums here:
https://en.forums.wordpress.com/Tips on getting help in the forums: https://en.support.wordpress.com/getting-help-in-the-forums/
I found this on another site, poster’s name included for credit, this fixed me right up and got Superhero performing as expected:
newhavensundayvigil
After struggling to set up the Superhero post slider (as in the demo) for our wordpress.com blog, I have decided to share a step-by-step set of instructions we used to get the slider to work at our blog. I do not know if this is the best way – just a way that worked for us.
Our blog is: https://newhavensundayvigil.wordpress.com/.
Let’s say you want to set up a slider featuring three consecutive posts/images. I will call these “Post1”, “Post2” and “Post3”, with Post1 appearing first, Post2 second and Post3 last in the slider.
1. Under the Dashboard, follow these instructions:
– Navigate to Appearance → Customize → Featured Content.
– Enter the name of a tag. Let’s call it “Picture1”.
– Click the blue “Save” button at the bottom.
2. Repeat step #1 and create two more Feature Content tags called “Picture2” and “Picture3”. Note that these are just tags, not the images themselves.
3. Create a post, titled “Post3”, with a featured image that is at least 960 pixels wide. Note: The featured image will look best at a 2.88:1 width-to-height ratio, and at least 500 pixels in height. IMPORTANT: you must add the featured image using the “Set feature image” button at the bottom right hand corner. Do not use the “Add Media” button underneath the Title space to add the image.
4. Give the post “Post3” the tags “Picture1”, “Picture2” and “Picture3”. I found that I had to add all three tags to the post to get our slider to work. Note that Post3 is, in fact, the last (and not the first) post to appear in the slider. Publish the post once you are happy with it.
5. Repeat Step #2 to create a post titled “Post2”.
6. Repeat Step #4 for “Post2”, this time adding only the tags “Picture2” and “Picture3”. Publish when you are OK with the post.
7. Repeat Step #2 to create a post titled “Post1”.
8. Repeat Step #4 for “Post1”, this time adding only the tag “Picture3”. Publish when you are satisfied.
9. I have found that, occasionally, I must navigate to Appearance → Customize → Featured Content, and re-save the tags “Picture1”, “Picture2” and “Picture3” to get the slider to behave properly, after publishing each of “Post1”, “Post2” and “Post3”.
Hope this helps!smaktakular – thanks for sharing your method for setting up the slider in case it helps others.
It’s quite interesting, because you list a few steps that shouldn’t be necessary, since only one tag is recognized for featured content, not multiple ones. I’m glad you got things working as you like in the end, though! If you need further help with your WordPress.com site, please do feel free to post in the WordPress.com forums and tag your post with the word modlook so a staff member will have a look.
Katryn,
i have the fuetured Content Slider on my page. I use 960×500 px for the images.
I would like to have all that smaller?
Maybe 500x250px.If i change the imagesize its stays big only stretched on 960×480
Hi max-chen – I’m not seeing a slider on your site here – https://routes-mag.com/ – so I wanted to make sure reducing the size of the slider is something you still wanted to do. I could point you in the right direction if you’re still interested.
p.s. in future, please feel free to start a new thread rather than adding to a very old one. You will likely get help faster because most folks only monitor new threads, not replies tacked onto old ones, especially when the issue is different than that discussed in the thread. You’ll get better help all-around. Thanks!
- The topic ‘how to set full width image on top?’ is closed to new replies.