I'm trying to display the post gallery manually, however images are resized to the default thumbnail size, which is way too small. I'm developing a theme which I'd like to sell in the future, so I would like to display the images from the gallery at a custom size, ignoring wordpress settings. How can I do that?
Here's my code:
if ( get_post_gallery() ) :
$gallery = get_post_gallery( get_the_ID(), false );
foreach( $gallery['src'] AS $src )
{
?>
<li data-thumb="<?php echo $src; ?>">
<img src="<?php echo $src; ?>" alt="Gallery image" />
</li>
<?php
}
endif;
I already specified my preffered size in my functions.php file like this: add_image_size( 'slider-size', 1200, 680 );.
So how can I display gallery images manually in a specific size?
You could use a filter to act on shortcode_atts_gallery before you call that gallery ...
add_filter('shortcode_atts_gallery','force_large_images',10,3);
function force_large_images($out, $pairs, $atts) {
$out['size'] = 'my_size'; // for example, "large"
return $out;
}
do not forget also to remove that filter if you do not want it any more ..
remove_filter('shortcode_atts_gallery','force_large_images',10,3);
another way would be to perform your own query ...
$args = array( 'post_mime_type' => 'image', 'post_type' => 'attachment', 'post_parent' => $post->ID, 'order' => 'ASC');
$attachments = get_children($args);
foreach( $attachments as $attachment) {
if ( !empty($attachment->guid ) ) {
$img_url = wp_get_attachment_image_src($attachment->ID, 'full'); //change *full* size with your custom size
// and then do something ..
}
Related
I've set up this query to show all Post from certain Custom Post Types but I would like to alter the query and change the featured image to a specific icon that relates to the Post Type instead of the set Featured Images
function my_query_by_post_types( $query ) {
$query->set( 'post_type', [ 'articles', 'events' ] );
}
add_action( 'elementor/query/all_post_types', 'my_query_by_post_types' );
For example instead of showing the featured images for the events, I'd like to show a calendar Icon for all the posts that appear.
You can filter the featured image output conditionally
function wpdocs_addTitleToThumbnail( $html,$post_id ) {
if ( get_post_type($post_id) === 'events' )
{
$html = '<img src="your_img_src"/>';
return $html;
}
return $html;
}
add_filter( 'post_thumbnail_html', 'wpdocs_addTitleToThumbnail' ,10,2);
You can do this using WP_Query, In your front-page.php you can put this
$args = array(
'post_type' => 'my-cpt'
);
$loop = new WP_Query($args);
while($loop->have_posts()) : $loop->the_post();
if( is_front_page()){
set_post_thumbnail(get_the_ID(),int $thumbnail_id );
}
// Shows the featured image of your choice with`$thumbnail_id`
the_post_thumbnail()
endwhile;
Get the $thumbnail_id of the image you want to set from "Media Library" and hovering/pressing Edit button .
I have been searching for weeks and I still haven't found a proper solution to this problem.
I am writing a Wordpress Theme. I have a custom post type called Works. I would like to add my Works archive to my menu and have it as well as it's posts highlighted when I access them.
I can access my archive and posts on the following links
Works archive: /works/
Works single post: /works/postname/
My solution so fare have been to name my archive-works.php template file with a template name (Work archive). Then create an empty page using that template and adding the page to the menu. This highlights the archive in the menu but not the single posts.
I can easily solve this with a custom link and some javascript but there must be a better and cleaner way.
You can do a simple trick in your functions.php:
add_filter('nav_menu_css_class', 'current_type_nav_class', 10, 2);
function current_type_nav_class($classes, $item) {
// Get post_type for this post
$post_type = get_query_var('post_type');
// Go to Menus and add a menu class named: {custom-post-type}-menu-item
// This adds a 'current_page_parent' class to the parent menu item
if( in_array( $post_type.'-menu-item', $classes ) )
array_push($classes, 'current_page_parent');
return $classes;
}
In your case, you just have to add a class 'works-menu-item' with that archive menu item by the admin panel;
To add "custom posttype archive link" to menu, please look at the following guide
Open file functions.php , and enter code below
add_action('admin_head-nav-menus.php', 'wpclean_add_metabox_menu_posttype_archive');
function wpclean_add_metabox_menu_posttype_archive() {
add_meta_box('wpclean-metabox-nav-menu-posttype', __('Custom Post Type Archives'), 'wpclean_metabox_menu_posttype_archive', 'nav-menus', 'side', 'default');
}
function wpclean_metabox_menu_posttype_archive() {
$post_types = get_post_types(array('show_in_nav_menus' => true, 'has_archive' => true), 'object');
if ($post_types) :
$items = array();
$loop_index = 999999;
foreach ($post_types as $post_type) {
$item = new stdClass();
$loop_index++;
$item->object_id = $loop_index;
$item->db_id = 0;
$item->object = 'post_type_' . $post_type->query_var;
$item->menu_item_parent = 0;
$item->type = 'custom';
$item->title = $post_type->labels->name;
$item->url = get_post_type_archive_link($post_type->query_var);
$item->target = '';
$item->attr_title = '';
$item->classes = array();
$item->xfn = '';
$items[] = $item;
}
$walker = new Walker_Nav_Menu_Checklist(array());
echo '<div id="posttype-archive" class="posttypediv">';
echo '<div id="tabs-panel-posttype-archive" class="tabs-panel tabs-panel-active">';
echo '<ul id="posttype-archive-checklist" class="categorychecklist form-no-clear">';
echo walk_nav_menu_tree(array_map('wp_setup_nav_menu_item', $items), 0, (object) array('walker' => $walker));
echo '</ul>';
echo '</div>';
echo '</div>';
echo '<p class="button-controls">';
echo '<span class="add-to-menu">';
echo '<input type="submit"' . disabled(1, 0) . ' class="button-secondary submit-add-to-menu right" value="' . __('Add to Menu') . '" name="add-posttype-archive-menu-item" id="submit-posttype-archive" />';
echo '<span class="spinner"></span>';
echo '</span>';
echo '</p>';
endif;
}
Thanks
Thanks to rasmussvanejensen for her/his nice question and thethangtran for the answer, I am still confused why Wordpress has not yet added such a good feature to its code base by default.
By the way I think there is even a better solution than the one provided by thethangtran, as it may break on some situations.
Note 1
According to the Codex, using register_post_type, one can add extra post_types to the installation. There is chance, some one need to change the 'query_var' and thus the provided code will break.
Note 2
In addition, it may not handle the current-menu-item class, which will be used for css customization to show the menu item as active.
Note 3
As another note on the code, there is no need to define the loop_index, item and items variables. they are absolutely useless.
A better solution
So I suggest using this alternative, for those who want a more robust solution to on this:
function prefix_add_metabox_menu_posttype_archive(){
add_meta_box( 'prefix_metabox_menu_posttype_archive', __( 'Archives' ), 'prefix_metabox_menu_posttype_archive', 'nav-menus', 'side', 'default' );
}
add_action( 'admin_head-nav-menus.php', 'prefix_add_metabox_menu_posttype_archive' );
function prefix_metabox_menu_posttype_archive(){
$post_types = get_post_types( array( 'show_in_nav_menus' => true, 'has_archive' => true ), 'object' );
if( $post_types ){
foreach( $post_types as $post_type ){
$post_type->classes = array( $post_type->name );
$post_type->type = $post_type->name;
$post_type->object_id = $post_type->name;
$post_type->title = $post_type->labels->name;
$post_type->object = 'cpt_archive';
}
$walker = new Walker_Nav_Menu_Checklist( array() );?>
<div id="cpt-archive" class="posttypediv">
<div id="tabs-panel-cpt-archive" class="tabs-panel tabs-panel-active">
<ul id="ctp-archive-checklist" class="categorychecklist form-no-clear"><?php
echo walk_nav_menu_tree( array_map( 'wp_setup_nav_menu_item', $post_types ), 0, (object) array( 'walker' => $walker ) );?>
</ul>
</div>
</div>
<p class="button-controls">
<span class="add-to-menu">
<input type="submit"<?php disabled( $nav_menu_selected_id, 0 ); ?> class="button-secondary submit-add-to-menu" value="<?php esc_attr_e( 'Add to Menu' ); ?>" name="add-ctp-archive-menu-item" id="submit-cpt-archive" />
</span>
</p><?php
}
}
function prefix_cpt_archive_menu_filter( $items, $menu, $args ){
foreach( $items as &$item ){
if( $item->object != 'cpt_archive' ) continue;
$item->url = get_post_type_archive_link( $item->type );
if( get_query_var( 'post_type' ) == $item->type ){
$item->classes []= 'current-menu-item';
$item->current = true;
}
}
return $items;
}
add_filter( 'wp_get_nav_menu_items', 'prefix_cpt_archive_menu_filter', 10, 3 );
Navigate to Appearance > Menus;
Make sure you have the Works' custom post type selected at Screen Options;
Click on the name of your custom post type to expand it and then click on the ‘View all’ tab;
You will see an option for All Works. Check the box next to it and then click on the Add to Menu button;
Your custom post type archive will now appear as a menu item in the right column;
By default, the label will be "All Works". You can change this by writing something different at the Navigation Label;
Click on the Save Menu button to save your changes.
I found a solution on GitHub and it works out of the box by simply adding it to the functions.php without any walkers or extra classes.
This code solves it by comparing the slug of the current post type
with the navigation items, and adds a class accordingly.
Code on GitHub
I'm creating a website with a carousel. To load images, I'm using Advanced Custom Fields on Wordpress.
Here is my code :
<?php $images = get_field('slides', $post->ID);
// clean_print_r($images);
if (!empty($images)) :
?>
<div class="wide-container">
<div id="slides">
<ul class="slides-container">
<?php for($i = 0; $i < count($images); $i++): ?>
<!-- slides -->
<li>
<img src="<?php echo $images[$i]['img_slide']['sizes']['large'] ?>" alt="" />
</li>
<?php endfor; ?>
</ul>
</div>
</div>
<?php endif; ?>
I can load images, but they are sized at 1024px wide:
<img src="http://example.com/wp-content/uploads/2013/09/bg_header03-1024x341.jpg" ... />
Is there any way to get full sized images? I've tried to replace :
['img_slide']['sizes']['large']
with
['img_slide']['sizes']['full']
But that doesn't work, and no images are loaded.
In ACF I call image attachment by ID, and it's a repeater field.
Im not sure how do it with return IDs but if you return URL instead you get the full image.
Edit:
Ok I did some test with the Image ID instead, looks like you've confused your array handling somehow. This works for a single image: Should be easy to adapt to your repeater though.
$attachment_id = get_field('slide');
$size = "full";
$image = wp_get_attachment_image_src( $attachment_id, $size );
echo '<img src="' . $image[0] . '">';
//OR
$image = wp_get_attachment_image( $attachment_id, $size );
echo $image[0];
My previous answer was about return: image ID, as specified by the thread starter but now i realize that he was actually talking about return: object.
/*
* Return value = Object
* requires ACF 3.3.7+
*/
$image = get_field('image');
var_dump($image);
/*
Data returned will look like this:
Array
(
[id] => 540
[alt] => A Movie
[title] => Movie Poster: UP
[caption] => sweet image
[description] => a man and a baloon
[url] => http://localhost:8888/acf/wp-content/uploads/2012/05/up.jpg
[sizes] => Array
(
[thumbnail] => http://localhost:8888/acf/wp-content/uploads/2012/05/up-150x150.jpg
[medium] => http://localhost:8888/acf/wp-content/uploads/2012/05/up-300x119.jpg
[large] => http://localhost:8888/acf/wp-content/uploads/2012/05/up.jpg
[post-thumbnail] => http://localhost:8888/acf/wp-content/uploads/2012/05/up.jpg
[large-feature] => http://localhost:8888/acf/wp-content/uploads/2012/05/up.jpg
[small-feature] => http://localhost:8888/acf/wp-content/uploads/2012/05/up-500x199.jpg
)
)
*/
source: http://www.advancedcustomfields.com/resources/field-types/image/
So apparently the original image is not a size but the URL, therefore change:
['img_slide']['sizes']['large']
to
['img_slide']['url']
and you should be fine
I was able to remove the featured image metabox from custom post types of pages. Below is what I used:
add_action('do_meta_boxes', 'remove_thumbnail_box');
function remove_thumbnail_box() {
remove_meta_box( 'postimagediv','page','side' );
}
However, what I really want to do is to only apply this to a specific page template. Is this possible?
Thanks!
Ah, I found a solution.
$post_id = $_GET['post'] ? $_GET['post'] : $_POST['post_ID'] ;
$template_file = get_post_meta($post_id,'_wp_page_template',TRUE);
if ($template_file === 'page-template-name.php') {
add_action('do_meta_boxes', 'remove_thumbnail_box');
function remove_thumbnail_box() {
remove_meta_box( 'postimagediv','page','side' );
}
}
If there's a better solution... please don't hesitate to post.
Thanks!
For anyone else looking to remove featured image support programatically (the comments should be self explanatory):
/**
* Removes the featured image metabox from specific pages (by ID)
* #note: populate the $excluded_page_ids_array array with page IDs
*/
function eh_remove_featured_image_metabox_from_specific_pages() {
// populate with page IDs to exclude featured image metabox from
$excluded_page_ids_array = array( 38, 29 );
// store the current post ID
$post_id = $_GET['post'] ? $_GET['post'] : $_POST['post_ID'];
// check if the current page is in our excluded array
if( in_array( $post_id, $excluded_page_ids_array ) ) {
// remove featured image metabox
remove_meta_box( 'postimagediv','page','side' );
}
}
add_action( 'do_meta_boxes', 'remove_featured_image_metabox_from_specific_pages' );
After adjusting the array of pages to exclude, you'll want to add this snippet to your themes functions.php file.
Alternatively, you can remove the featured image from all pages, except specified ones - where the featured image metabox will remain.
/**
* Removes the featured image metabox from all pages except specified ones
* #note: populate the $page_ids array with page IDs
*/
function eh_remove_featured_images_metabox_from_all_pages_except_specified() {
// populate with page IDs to keep the featured image metabox on
$page_ids = array( 25, 31 );
$post_id = $_GET['post'] ? $_GET['post'] : $_POST['post_ID'];
if( ! in_array( $post_id, $page_ids ) ) {
// remove featured image metabox
remove_meta_box( 'postimagediv','page','side' );
}
}
add_action( 'do_meta_boxes', 'eh_remove_featured_images_metabox_from_all_pages_except_specified' );
There is another solution. By editing the page.php
If your feature Image div Looks like below for example
<div class="thumbnail">
<?php echo get_the_post_thumbnail( $post_id, $size, $attr ); ?>
</div>
you can use
if (is_page( array( 42, 'about-me', 'Contact' ) );
// Returns true when the Pages displayed is either post ID :42, or post_name_slug "about-me", or post_title "Contact".
<?php
if (is_page( array( 42, 'about-me', 'Contact' ) ) ) {
?>
<div class="thumbnail" style="display:none;">
<?php echo get_the_post_thumbnail( $post_id, $size, $attr ); ?>
</div>
<?php
}else{
?>
<div class="thumbnail">
<?php echo get_the_post_thumbnail( $post_id, $size, $attr ); ?>
</div>
<?php}?>
I learned how to create a plugin on WordPress a while ago. However, WordPress changed everything around and I'm trying to create the same plugin using the new WordPress format. I've read several things, but tried to jump right in by modifying the WordPress Text Field plugin (one of my goals with redoing the plugin was to make it usable multiple times). I realize the code is really rough, but I'm stuck. I've tried to add two new fields just to see how things go and while they appear when I go to edit the widget once you click save on the Title and first textarea data gets saved, the other two fields dissapear.
I have a feeling I'm missing something obvious, but I just can't seem to figure it out. Here's the code:
'widget_text', 'description' => __('Text or HTML'));
$control_ops = array('width' => 400, 'height' => 350);
$this->WP_Widget('text', __('Multi Excerpt'), $widget_ops, $control_ops);
}
function widget( $args, $instance ) {
extract($args);
$title = apply_filters( 'widget_title', empty($instance['title']) ? '' : $instance['title'], $instance );
$text = apply_filters( 'widget_text', $instance['text'], $instance );
$texta = apply_filters( 'widget_text', $instance['texta'], $instance );
$posts = $instance['posts'];
echo $before_widget;
if ( !empty( $title ) ) { echo $before_title . $title . $after_title; } ?>
'', 'text' => '', 'posts' => '', 'texta' => '' ) );
$title = strip_tags($instance['title']);
$text = format_to_edit($instance['text']);
$texta = format_to_edit($instance['texta']);
$posts = $instance['posts'];
?>
get_field_id('title'); ?>">
get_field_id('title'); ?>" name="get_field_name('title'); ?>" type="text" value="" />
get_field_id('text'); ?>" name="get_field_name('text'); ?>">
get_field_id('texta'); ?>" name="get_field_name('texta'); ?>">
get_field_id('posts'); ?>">Posts:
get_field_id('posts'); ?>" name="get_field_name('posts'); ?>" type="text" value="" />
Thanks in advance.
Edited: I found my original answer was somewhat correct. Below are the details needs to fix your problem.
Change your WP_Widget_Excerpt function to:
function WP_Widget_Excerpt() {
$widget_ops = array('classname' => 'WP_Widget_Excerpt', 'description' => __('Text or HTML'));
$control_ops = array('width' => 400, 'height' => 350);
$this->WP_Widget('WP_Widget_Excerpt', __('Multi Excerpt'), $widget_ops, $control_ops);
}
If your Widget is doing something simple you can use Widgetifyr.com to create your widget for you. I creates the old style widget as well as the new 2.8+ class based widget. This way your widget will run on more versions of Wordpress.