Comments riseschooluk started the conversationSeptember 8, 2022 at 8:48amI want to change the Course Card design. How can I do that?[deleted] repliedSeptember 9, 2022 at 2:01pmWell it can be changed by editing the page .Please share the page url where this is showing . riseschooluk replied privately[deleted] repliedSeptember 12, 2022 at 2:12pmedit page in elementor and then : https://prnt.sc/2WoKpeY7kb6m riseschooluk replied privately[deleted] repliedSeptember 14, 2022 at 12:06pmWell im sorry these cannot be edited . you can add extra content using this hook : add_filter('wplms_course_thumb_extras',function($html){$extrahtml = '<div class="course-more"><a href="'.get_permalink().'">See more</a></div>'; return $html.$extrahtml.;});riseschooluk repliedSeptember 14, 2022 at 1:37pmwhere exactly to add this hook code?and after adding the hook where do I edit the newly added card design?[deleted] repliedSeptember 15, 2022 at 3:14pmYou cannot create new design as I said you can only add some html to existing designs . for code please refer : https://wplms.io/support/knowledge-base/how-to-use-coding-tips/riseschooluk repliedSeptember 18, 2022 at 11:22amGot you..but I'm unable to find out the exact class name/function name to change 'courseitem'.I want my course card to look like the image below. what exactly the code will look like?[deleted] repliedSeptember 20, 2022 at 1:05pmWell you cannot edit the courseitem class .what you can do is : change this option to "Course card" : then create your own card from wp-admin -> vibebp-> course card -> add new ,edit it with elementor . riseschooluk repliedSeptember 21, 2022 at 11:37amokay.but how do I change the option to "Course card" ?there isn't any option like that.Do I need to add any code somewhere?[deleted] repliedSeptember 22, 2022 at 11:56amPlease goto wp-admin -> vibebp-> course cards .The topmost course card loads there in the directory . So edit that course or create new one which will load there .riseschooluk repliedSeptember 25, 2022 at 9:43amI've created a new card named "Course Card",Yet I'm not getting any option as you said[deleted] repliedSeptember 26, 2022 at 2:59pmOk for that you need to use this tip : https://wplms.io/support/knowledge-base/creating-custom-featured-block-style/riseschooluk repliedSeptember 27, 2022 at 11:13amThanks.It worked.riseschooluk repliedSeptember 27, 2022 at 6:30pmCan you please tell me how can I set the "student_number", "price" and "discounted price" in the custom code? Like, "$post->post_title" is for the course title.. [deleted] repliedSeptember 28, 2022 at 2:40pmcan you please share the page url where this is coming up ? riseschooluk replied privately riseschooluk replied privately[deleted] repliedOctober 3, 2022 at 12:30pmTo change student mumber please check this value in backend edit course : https://prnt.sc/xLPdPuKdu4Qchttps://prnt.sc/Obd_K9H0d2hwprice can be changed by editing course -> course pricing/accessibility settings riseschooluk repliedOctober 5, 2022 at 2:38pmI am sorry; I wanted to mean, "How can I SHOW "student number", "price" and "discounted price" in custom course card writing custom code...I need the hook that will show this informations in course card..Like, "$post->post_title" show the "course title" in course card.. [deleted] repliedOctober 8, 2022 at 7:25amIm not getting where do you want to show these info .these are already showing here : https://prnt.sc/VhFhWQh-S8t8[deleted] repliedOctober 8, 2022 at 7:26amIF you want to show custom card in vibe carousel then follow https://wplms.io/support/knowledge-base/creating-custom-featured-block-style/riseschooluk repliedOctober 9, 2022 at 6:02amYes, I've followed this tutorial.But the problem is in the given card, the price is not showing.Here card will showPost/Course Thumbnail[get_the_post_thumbnail($post->ID,'medium')]Post/Course title[$post->post_title]Anchor link of the post[get_permalink($post->ID)]Similarly, how can show the "price" and "discounted price" on a custom card using this below code? function custom_vibe_featured_thumbnail_style($thumbnail_html,$post,$style){ if($style == 'custom_block'){ //Custom block is the same name as added for the thumbnail in pagebuilder $thumbnail_html =''; $thumbnail_html .= '<div class="block customblock">'; $thumbnail_html .= '<div class="block_media">'; $thumbnail_html .= '<a href="'.get_permalink($post->ID).'">'.get_the_post_thumbnail($post->ID,'medium').'</a>'; $thumbnail_html .= '</div>'; $thumbnail_html .= '<div class="block_content">'; $thumbnail_html .= '<h4 class="block_title"><a href="'.get_permalink($post->ID).'" title="'.$post->post_title.'">'.$post->post_title.'</a></h4>'; $thumbnail_html .= '</div>'; } return $thumbnail_html; }</div> [deleted] repliedOctober 11, 2022 at 12:33pmfunction custom_vibe_featured_thumbnail_style($thumbnail_html,$post,$style){ if($style == 'custom_block'){ //Custom block is the same name as added for the thumbnail in pagebuilder $thumbnail_html =''; $thumbnail_html .= ''; $thumbnail_html .= ''; $thumbnail_html .= ''.get_the_post_thumbnail($post->ID,'medium').''; $thumbnail_html .= ''; $thumbnail_html .= ''; $thumbnail_html .= ''.$post->post_title.''; $pid= get_post_meta($post->ID,'vibe_product',true); if(!empty($pid)){ $product = wc_get_product($pid); $thumbnail_html .= ''.$product->get_regular_price().''; $thumbnail_html .= ''.$product->get_sale_price().''; } $thumbnail_html .= ''; } return $thumbnail_html; } Sign in to reply ...
I want to change the Course Card design. How can I do that?
Well it can be changed by editing the page .Please share the page url where this is showing .
edit page in elementor and then : https://prnt.sc/2WoKpeY7kb6m
Well im sorry these cannot be edited .
you can add extra content using this hook :
add_filter('wplms_course_thumb_extras',function($html){
$extrahtml = '<div class="course-more"><a href="'.get_permalink().'">See more</a></div>';
return $html.$extrahtml.;
});
You cannot create new design as I said you can only add some html to existing designs . for code please refer : https://wplms.io/support/knowledge-base/how-to-use-coding-tips/
Got you..
but I'm unable to find out the exact class name/function name to change 'courseitem'.
I want my course card to look like the image below. what exactly the code will look like?
Well you cannot edit the courseitem class .
what you can do is :
change this option to "Course card" :
then create your own card from wp-admin -> vibebp-> course card -> add new ,edit it with elementor .
okay.
but how do I change the option to "Course card" ?
there isn't any option like that.
Do I need to add any code somewhere?
Please goto wp-admin -> vibebp-> course cards .The topmost course card loads there in the directory .
So edit that course or create new one which will load there .
I've created a new card named "Course Card",
Yet I'm not getting any option as you said
Ok for that you need to use this tip :
https://wplms.io/support/knowledge-base/creating-custom-featured-block-style/
Thanks.
It worked.
Can you please tell me how can I set the "student_number", "price" and "discounted price" in the custom code?
Like, "$post->post_title" is for the course title..
can you please share the page url where this is coming up ?
To change student mumber please check this value in backend edit course :
https://prnt.sc/xLPdPuKdu4Qc
https://prnt.sc/Obd_K9H0d2hw
price can be changed by editing course -> course pricing/accessibility settings
I am sorry; I wanted to mean, "How can I SHOW "student number", "price" and "discounted price" in custom course card writing custom code...
I need the hook that will show this informations in course card..
Like, "$post->post_title" show the "course title" in course card..
Im not getting where do you want to show these info .
these are already showing here : https://prnt.sc/VhFhWQh-S8t8
IF you want to show custom card in vibe carousel then follow
https://wplms.io/support/knowledge-base/creating-custom-featured-block-style/
Yes, I've followed this tutorial.
But the problem is in the given card, the price is not showing.
Here card will show
Similarly, how can show the "price" and "discounted price" on a custom card using this below code?
function custom_vibe_featured_thumbnail_style($thumbnail_html,$post,$style){ if($style == 'custom_block'){ //Custom block is the same name as added for the thumbnail in pagebuilder $thumbnail_html =''; $thumbnail_html .= '<div class="block customblock">'; $thumbnail_html .= '<div class="block_media">'; $thumbnail_html .= '<a href="'.get_permalink($post->ID).'">'.get_the_post_thumbnail($post->ID,'medium').'</a>'; $thumbnail_html .= '</div>'; $thumbnail_html .= '<div class="block_content">'; $thumbnail_html .= '<h4 class="block_title"><a href="'.get_permalink($post->ID).'" title="'.$post->post_title.'">'.$post->post_title.'</a></h4>'; $thumbnail_html .= '</div>'; } return $thumbnail_html; }</div>