Is there a way of using featured image for only categories on the page but not using it in the main slider. Of cos at times I want to use it in the main slider but there are some news items that I don’t see as necessary for the the slider but should be on the page with a thumbnail
This is important to me because with the featured image comes thumbnail.
Please treat as urgent.
Kind regards
Hi there here is the solution for your problem then 😀 It’s quite long so please read carefully 🙂
1st step: In this step , we need to create a metabox in post back-end so you can do like this :
Open functions.php and put these codes to the bottom 😀
/*-----------------------------------------------------------------------------------*/
/* Metabox
/*-----------------------------------------------------------------------------------*/
if( !function_exists('dw_wall_image_post_enqueue_script') ){
function dw_wall_image_post_enqueue_script() {
wp_enqueue_script( 'upload-image-script', get_template_directory_uri() . '/assets/js/upload_image.js' );
}
add_action( 'admin_enqueue_scripts', 'dw_wall_image_post_enqueue_script' );
}
if( !function_exists('dw_wall_post_image_metabox') ){
function dw_wall_post_image_metabox(){
add_meta_box( 'dw_wall_custom_image_upload', 'Image upload', 'dw_wall_image_post', 'post', 'normal' );
}
add_action( 'admin_init', 'dw_wall_post_image_metabox' );
}
if( !function_exists('dw_wall_image_post') ){
function dw_wall_image_post( $pos0,$boxt ){
wp_enqueue_media();
?>
<h4>Media</h4>
<input class="image_container" id="dw_wall_custom_image_upload" name="dw_wall_custom_image_upload" value="<?php echo get_post_meta(get_the_ID(), '_dw_wall_custom_image_url', true);?>">
<button class="upload_image_button" >Upload</button>
<?php
}
}
if( !function_exists('dw_wall_image_post_save') ){
add_action( 'save_post', 'dw_wall_image_post_save' );
function dw_wall_image_post_save( $post_id ){
if( ! empty( $_POST['dw_wall_custom_image_upload'] ) ){
update_post_meta( $post_id, '_dw_wall_custom_image_url', $_POST['dw_wall_custom_image_upload'] );
} else {
delete_post_meta( $post_id, '_dw_wall_custom_image_url' );
}
}
}
Step 2 : Go to assets -> js -> create a new js file name : upload_image.js ( this js file to enable upload media in back-end custom field )
And as you see in “Enqueue script” code to make the js work in back end)
In this js file , you use this code :
jQuery(function($){
var file_frame;
jQuery('.upload_image_button').live('click', function( event ){
event.preventDefault();
// If the media frame already exists, reopen it.
if ( file_frame ) {
file_frame.open();
return;
}
// Create the media frame.
file_frame = wp.media.frames.file_frame = wp.media({
title: jQuery( this ).data( 'uploader_title' ),
button: {
text: jQuery( this ).data( 'uploader_button_text' ),
},
multiple: false // Set to true to allow multiple files to be selected
});
var current = 0;
// When an image is selected, run a callback.
file_frame.on( 'select', function() {
attachment = file_frame.state().get('selection').first().toJSON();
var url = attachment.url;
$('.image_container').val(url);
});
// Finally, open the modal
file_frame.open();
});
});
Final step : Now you will see the box in back-end post like this :
http://imgur.com/WLrINAn.
The link of your image will store in a post meta , you can use that picture at any where you want by use this :
<img src="<?php echo get_post_meta(get_the_ID(), '_dw_wall_custom_image_url', true); ?>">
And in single post , or widget , just use that picture instead of thumbnail , you will have that picture appear replace the thumbnail therefor , that post will not show on the slider.. it’s will be lots of work to do if you want to custom the theme as you want :). Best regards !
Thanks so far. I have implemented STEP 1. On STEP 2, I can’t find assets -> js -> . How do I get there?. That is why I am so far. Regards
I mean in the theme folder, go to assets –> js
It's like this : dw-focus/assets/js
then you should create a new Javascript File : name it : upload_image.js
and then put that code in step 2 to it 🙂
Btw : this step 2 just to enable the media upload for that upload button 😀 with the step 1 , you can save content in that text box at backend :), you can push image link in that box , and get it out by using the code:
echo get_post_meta(get_the_ID(), '_dw_wall_custom_image_url', true);
If you have more trouble , just ask , i'll try my best to help you 😀
@nobita , thanks for your help, that’s awesome, my buddy 🙂
@Seiperi Fyn-Sydne, please refer to the solution that @nobita gave above. If there is anything else you need to assist, don’t hesitate to contact us. We are ready to support you.
I have implemented Steps 1 and 2. I FTPed the file to the appropriate folder and location.Thanks @Nobita, @DominicNow, I decided to test it using the story on the home page – The Interview Movie Sells Out In U.S (http://pearl.com.ng/2014/12/the-interview-movie-sells-out-in-u-s/) but the thumbnail didn’t show in the home pageBelow is what the post page looked likehttp://prntscr.com/5ldju6Thanks once more far. I really appreciate all your effortsRegards
yes, it’s like that , now the picture of a post will store in a post meta. But it’s not the thumbnail, just a picture then. The using of it depends on you, that’s why i mean : ” it’s will be lots of work to do if you want to custom the theme as you want “. You want it to appear at home page , you need to add some code to the widgets you need ( inc->widgets ), this is not the thumbnails , so to call it you have to use
get_post_meta(get_the_ID(), ‘_dw_wall_custom_image_url’, true);
Go to the widget you need , use it ( but not use it in the widget that make the slider ). It’s a bit complex thou 🙂
This is an example for latest news: You can go to widget –> dw-focus-lastest-news.php
line 38 -> 53 , replace like this :
<?php
if( has_post_thumbnail( get_the_ID() ) || get_post_meta(get_the_ID(), '_dw_wall_custom_image_url', true) ) {
$class = ' has-thumbnail';
}
?>
<article id="post-<?php the_ID(); ?>" <?php post_class($class); ?> >
<?php if( has_post_thumbnail() || get_post_meta(get_the_ID(), '_dw_wall_custom_image_url', true) ) : ?>
<div class="entry-thumbnail">
<a href="<?php the_permalink(); ?>" title="<?php echo esc_attr( sprintf( __( 'Permalink to %s', 'dw_focus' ), the_title_attribute( 'echo=0' ) ) ); ?>" rel="bookmark">
<?php if ( has_post_format('Video') || has_post_format('Audio') || has_post_format('Gallery')) : ?>
<?php echo dw_focus_post_format_icons(); ?>
<?php endif ?>
<?php
if ( has_post_thumbnail() ) {
the_post_thumbnail('medium');
} elseif ( get_post_meta(get_the_ID(), '_dw_wall_custom_image_url', true) ) {
?>
<img src="<?php echo get_post_meta(get_the_ID(), '_dw_wall_custom_image_url', true); ?>">
<?php
}
?>
</a>
I just added the specified code into dw-focus-lastest-news.php between line 38 – 53, yet I didn’t see the thumbnail in the home page in the story The Interview Movie Sells Out In U.S ( Under News). Regards
Oops ,sorry 😀 that's just for the lastest news widget 🙂 , for categories widget then : you can open:Inc -> widget -> dw_focus_categories.php :Line 239 –> 247 : replace
$i = 0;
if( $i == 0 ){ $posts->the_post();
$i++;
$post_class = '';
if(has_post_thumbnail() || get_post_meta(get_the_ID(), '_dw_wall_custom_image_url', true) ) $post_class = 'has-thumbnail';
?>
<article >
<a href="" title="" rel="bookmark">
<?php if( has_post_thumbnail( get_the_ID() ) ) { the_post_thumbnail('thumbnail');
} elseif ( get_post_meta(get_the_ID(), '_dw_wall_custom_image_url', true) ) { ?> <img src=" <?php echo get_post_meta(get_the_ID(), '_dw_wall_custom_image_url', true); ?> ">
<?php } ?>
</a>
BTW this just for full width option.
Please verify the above code. In my dreamweaver development environment. It tells me that there is an error on a particular line and also observed that ; is missing after $i++Regards
sr , it’s only thing that missing in that code 😀
The line numbering you specified was not the same in my dreamweaver though very close and also, I keep getting getting the error message as well. I have attached a photo image http://prntscr.com/5m5snr . Please confirm or attached a photo showing specified area. Thank so so much
Hello Long time. i keep error message while trying to implement the changes. This is what i did…$i = 0;if( $i == 0 ){ $posts->the_post();$i++; $post_class = ”; if(has_post_thumbnail() || get_post_meta(get_the_ID(), ‘_dw_wall_custom_image_url’, true) ) $post_class = ‘has-thumbnail’;?> <article > <a href="” title=”” rel=”bookmark”><?php if( has_post_thumbnail( get_the_ID() ) ) { the_post_thumbnail(‘thumbnail’);} elseif ( get_post_meta(get_the_ID(), ‘_dw_wall_custom_image_url’, true) ) { ?> <img src=" “> <?php } ?> On the contrary I have sent email to hi@ and [email protected] with the exact file dw-focus-categories.php. Pls edit from your end and send it back .Kind regards
I have helped you change the file, you can download new file here: https://www.dropbox.com/s/m05rjeyq5et2jr7/dw-focus-categories.php?dl=0
Or you can download from your email.
If you still face there issue, you can send me username & password of your site (via private answer) for further checking.
Hope this helps !
Thanks Dominic for all your assistance but the script didn’t work rather it knocked off the home page when I uploaded it. Luckily for me I had an old backup on my pc which I used to restore the website. If I may ask, where is my lovely Nobita? Hope you understand What I really want to achieve? I have sent my ftp info to your email. Regards
@Seiperi: Hi there , sorry for late reply 🙂 , Thanks @Nobita it worked but there is one thing, the SIZE. The size of the image/picture need to be resized to conform with other images on the home. For example the images of the stories 100 days: Gen Adebayo Applauds Fayose’s Achievements (News) http://imgur.com/pPJCD0J,bWfazJx and Buhari;s daughter, Zahra Buhari deletes twitter account days after becoming ‘twitfamous (Entertainment) http://imgur.com/pPJCD0J,bWfazJx#1 both on the home page came out with their original sizes. This puts disfigures the beauty of the entire design. Please reduce the original size for the home here. Thanks so so much for all the lovely support once more. Hope to hear from you. Kind Regards
i try to upload the : dw-focus-categories.php to mediafire,
you can verify the code from line 237 – 258 or you can download the file and replace it 🙂
Here is the link :
@Seiperi: Hi there 🙂 to resolve that problem i have to modify some code in dw-focus-categories at line 248–> 255 , or you can download this to replace
@Nobita… Thanks so so much. Bless your soul. It worked perfectly. I have tested it.
@Nobita… The news and entertainment category is fine as shown here (http://imgur.com/7433sGV,Ky5bmnd) but the Politics category shown here (http://imgur.com/7433sGV,Ky5bmnd#1) I think is missing some CSS. The photo in the story Lagos cancels monthly sanitation for PVCs is not there. Please see to it. Kind regards
Hi 🙂 , just comeback after my weekend, about the question, i see why : as i said , it's just for full width option , the 2nd picture is in 3-columns option in customize 😀 i need to modify a bit 😀
Try replace with this link : http://www.mediafire.com/view/zhn2pufp0pnb4fh/dw-focus-categories.php
It worked. Thanks. The only problem now is the width which I think might be a CSS issue. Take a look at political story in the link here http://imgur.com/VlpN2yk
This link http://imgur.com/YPWm9Rg also explains the same issue. Regards
You might have to look into this CSS again. It worked fine but it distorted the image of a recent post with featured image see before(http://imgur.com/NlcQwgM,geeixDZ,BauQ51v#0; http://imgur.com/NlcQwgM,geeixDZ,BauQ51v#1; http://imgur.com/NlcQwgM,geeixDZ,BauQ51v#2)….. See After with new CSS addition (http://imgur.com/PXivU3x,I8ouh62,BhSiSRl#0; http://imgur.com/PXivU3x,I8ouh62,BhSiSRl#1; http://imgur.com/PXivU3x,I8ouh62,BhSiSRl#2)…. Thank you so much. Regards
Please remove the css code then restore your Username/password that you sent me previous. We will help you resolve this issue.
I have removed the css and also just sent you email….Thanks Dominic
I have helped you resolve this issue. Regarding image size, You need upload the image size 770x400px.
what do you mean by upload image size? Pls explain. Also that the image didn’t show here (http://imgur.com/QFVxjAh) @Nobita added an upload link for post that would not be using Featured Image ie the story or post is not supposed to appear on the main slider on the home page. It has been working well until now. That was the main thing @Nobita has been working on. Pls see to it. Thanks…..Do you have wordpress themes i can use for Church websites and a Property Company?… Kind regards
I think it worked fine. Will test for a while and get back to you? Still interested in the image size thing and the new themes for Churches and property firm
@Dominic. I put posted a story titled “UAE Introduces Strict Visa Age Restriction For Nigerians Travelling To Dubai” and made it stick to the home page but the thumbnail is not showing, http://imgur.com/jBdpyV1 . Please see to it. Thanks for all the support. Regards
Hi Seiperi 🙂 , i think it not work be cause the widget you use here is not categories widget , It’s Recent post widget , so you need to modify in : \inc\widgets\dw-focus-recent-posts.php. Glad!
Ok. So can you give what need to be added and at what point/place. Regards
Please login or Register to submit your answer
replied 10 years ago
hi there, i'm a little bit confuse about your question , don't know what it really means. but if you want to use the featured image you can use this code : get_the_post_thumbnail();
It'll get the featured image of a post.you can read more at :https://codex.wordpress.org/Function_Reference/get_the_post_thumbnail
replied 10 years ago
Let me rephrase. From my understanding of the DWFOCUS Theme, featured images are used primary with the home page slider but I want publish a new article and I don’t want the article to appear on the home page slider but still appear on the home page but this time with only with thumbnail. Take a look at this story “The Lagos street carnivals are here again” on my website (www.pearl.com.ng) home page. You would notice that featured image was not used on the story “The Lagos street carnivals are here again” at the time of publish because we didn’t want the story to appear on the home page slider but some where still on the home page because of that we lost the opportunity of getting it a thumbnail. So, HOW DO WE GET A THUMBNAIL FOR A NEW A POST THAT WE DON’T WANT TO APPEAR ON THE HOME PAGE SLIDER?Please treat urgent.Regards
replied 10 years ago
in my opinion, i think that is a feature of DW-focus theme (News Slider widget) , so if you don't want it to appear on slider but still got thumbnail is quite impossible then .Some how , there is another way to resolve this problem but it's quite complex : add a metabox in back-end to upload a media or picture that you want it to be a thumbnail.After that , you can save it to a post_meta and then use it as a post's thumbnail ( because the query out of it differ than the thumbnail ). You can use that picture to appear at other widget.Read more at here :
Seiperi Fyn-Sydney
replied 10 years ago
Great. Can you guide me in implementing the metabox in the necessary backend areas?….Merry Christmas