Please correct me since I think I’ll be using the wrong terms here, but:
– I’m using Portfolio items
– adding a 1024 x 1024 app icon as the Featured image
– they look great as full, rounded icons on the main portfolio page
– but sometimes the WordPress cropped version isn’t great when these Featured images are used as the top banner (?) on the Portfolio entry’s individual page. Like this one.
– The developer of that app has asked if I can change the crop just on that page to feature the top of the icon, instead of the center, so the halo is more visible.
Is it possible to change the crop of only certain versions of this thumbnail? Thanks for your help!
Hey,
Could you please create a css to remove the thin grey border from:
– single page product image
– related products images
– product images on the product listing page
Cheers
Hey mecdesign!
The image that pops up in the magnific popup is going to the fullsized image and not a thumbnail. The magnific script is going to constrain it so it fits as large as possible inside your screen dimensions. I recommend keeping it like this otherwise it will annoy users (especially on mobiles) as they will have to scroll around to see the full image.
Cheers!
Elliott
Im trying to change the size of the lightbox image that pops up when you click on a portfolio item. The lightbox image seems to be a little small for the display sizes that are available now.
I have looked at the functions-enfold.php document. That is the only place that shows a size of 1030 which the lighbox images seem to be.
I looked at the theme functions (functions.php) and that only shows the sizes for the images of the finished images sizes for thumbnails and the images on the page….. NOT the lightbox.
I tried changing the size on the functions-enfold.php document and then making a new page and importing new images from scratch the make the images but they stay the same size as before.
Any help would be appreciated!
Really odd but on mobile device, one thumbnail is being rotated 180*. I replaced the portfolio page, i replaced the slider, i changed the photo. It looks fine on Desktop and laptop but on mobile and ipad its rotated?
Hi amolson7!
Open up /enfold/config-templatebuilder/avia-shortcodes/masonry_entries.php and change line 704 from this.
$this->loop[$key]['url'] = get_permalink($id);
To this.
$this->loop[$key]['url'] = wp_get_attachment_image_src(get_post_thumbnail_id($id), apply_filters('avf_avia_builder_masonry_lightbox_img_size','large'));
$this->loop[$key]['url'] = reset($this->loop[$key]['url']);
That will have the masonry element images open in lightbox instead of linking to the post.
Cheers!
Elliott
Hey evergreenmedia!
Thank you for using Enfold.
You can use the Simple Image Sizes plugin. Go to Settings > Media panel then adjust the entry_with_sidebar thumbnail size. Update then save changes before regenerating the thumbnails.
Cheers!
Ismael
Hi
am hoping you could help.
Having trouble with code for gallery.
The requirement is for a two column masonry gallery, 1 pixel gap, each image linking to lightbox and with theme animation.
The code (below):
a) was created in the Default Editor box ( not advanced avia layout) using shortcode insert and then pasted into a Formidable Pro Form- Create Custom Post section with [341…] being the Form Field for multi-uploaded images (gallery images).
b) creates one row and two columns, but only displays one image (in the second column). The other uploaded images are not displayed?
[av_masonry_gallery ids='[341 show=id]’ link=”file” items=’12’ columns=’2′ paginate=’load_more’ size=’flex’ gap=’1px’ overlay_fx=” caption_elements=’none’ caption_display=’always’ container_links=’active’ id=”]
I have tried may variations including code example below – which displays two columns but tiny thumbs and overlapping layout:
[gallery ids='[341 show=id]’ style=’portfolio’ preview_size=’portfolio’ crop_big_preview_thumbnail=’big-crop-thumb’ thumb_size=’portfolio’ columns=’2′ imagelink=’lightbox’ lazyload=’deactivate_avia_lazyload’ show=id link=”file”]
It was made using the insert gallery shortcode (as opposed to avia masonry gallery as per top code)
Thanks in advance.
Best
Chris
Hey!
The masonry images or overview thumbnails are the featured image that you set on post or portfolio items. You can separate portfolio items or posts using categories. Edit the masonry element then select the category that you want to show. You can see an example here: http://wordpress.louisamore.com/?page_id=3452
Best regards,
Ismael
Hi!
Thank you for the info.
I created a test page then uploaded an image here: http://www.vanhoen.nl/test-image/
The theme creates different thumbnail sizes when you upload an image. Each thumbnails are used specifically on different elements of the theme (testimonial, posts, widgets etc). On the test page, I added 3 Images element then selected 3 different thumbnail versions of the image. The second image is the full or original version of the uploaded image.
Regards,
Ismael
Hi,
Can you please let me know how I can reduce the image size thumbnails in content sliders for 4 columns?
Thank you
Hey Marc!
Try opening up /enfold/includes/loop-index.php and change line 37 from this.
$current_post['slider'] = get_the_post_thumbnail($current_post['the_id'], $size);
To this.
$current_post['slider'] = get_the_post_thumbnail($current_post['the_id'], 'full');
Regards,
Elliott
Hi!
Enfold does not have a function to resize the images, it just defines a set of image sizes (set_post_thumbnail_size, functions.php:99-110) and then WordPress does the rest.
Regards,
Josue
In the gallery with preview:
Is it possible to show the image on click thumbnail, instead of on hover? Without a lightbox?
tnx
Hey Elliott,
Sure, I am trying to achieve this design:

On image – I want to display featured(category) news. They should have small thumbnail.
At the moment I only managed to display full post image.
If you will have a look at site you will see that it displays full-size image.
here on http://skincareninja.com/
I am wondering if [thumbnail] is giving a link for a file (for some reason the same as [url-link] full-size image – Maybe it is forced to give as there is no thumbnail image generated?
-
This reply was modified 11 years, 4 months ago by
db-studios.
Hi!
Did you configure the plugin once installed (Settings > Media)?, remember to choose a Cropping setting and regenerate the thumbnails.
Regards,
Josue
Hello-
After updating to 3.04, the footer icon images (both social and blog thumbnail images) have been shifted down about 10 or 15 pixels. What’s happened?
Michael
This reply has been marked as private.
Hi artspbseo!
You can add your own around lines 146 – 154 in /enfold/includes/helper-social-media.php.
'facebook' => array("encode"=>true, "encode_urls"=>false, "pattern" => "http://www.facebook.com/sharer.php?u=[permalink]&t=[title]"),
'twitter' => array("encode"=>true, "encode_urls"=>false, "pattern" => "https://twitter.com/share?text=[title]&url=[shortlink]"),
'gplus' => array("encode"=>true, "encode_urls"=>false, "pattern" => "https://plus.google.com/share?url=[permalink]" , 'label' => __("Share on Google+",'avia_framework')),
'pinterest' => array("encode"=>true, "encode_urls"=>true, "pattern" => "http://pinterest.com/pin/create/button/?url=[permalink]&description=[title]&media=[thumbnail]"),
'linkedin' => array("encode"=>true, "encode_urls"=>false, "pattern" => "http://linkedin.com/shareArticle?mini=true&title=[title]&url=[permalink]"),
'tumblr' => array("encode"=>true, "encode_urls"=>true, "pattern" => "http://www.tumblr.com/share/link?url=[permalink]&name=[title]&description=[excerpt]"),
'vk' => array("encode"=>true, "encode_urls"=>false, "pattern" => "http://vk.com/share.php?url=[permalink]"),
'reddit' => array("encode"=>true, "encode_urls"=>false, "pattern" => "http://reddit.com/submit?url=[permalink]&title=[title]"),
'mail' => array("encode"=>true, "encode_urls"=>false, "pattern" => "mailto:?subject=[title]&body=[permalink]", 'label' => __("Share by Mail",'avia_framework') ),
But I don’t think that icon is going to be included in the font files. You can try adding one that looks similar by doing this, http://kriesi.at/archives/enfold-version-2-3-say-hello-to-our-new-iconfont-uploader.
Best regards,
Elliott
I want to use the magazine element in avia layout builder to create a list of blog posts on my law firm’s home page for things like success stories and news. Some of the blog posts are in this wordpress site and once I set the correct category in each of those posts and in the magazine settings, I can see the list of posts fine. However, I also have an external blog site and I want to list links to posts on that other site using the magazine element. Is this possible?
From what I have tried so far, it appears that if you make a new post in the site and choose “link” in the settings, you end up with a post page on the site that has the title or text and you still have to click on that to reach the external link. I don’t want to make my viewers click twice – first on the link in the magazine list and then again on the link on my blog post – before they can view the external blog post.
Is there any way to configure the magazine so that one click on the post listed will take someone directly to the external post?
I know I could just make a text box with a list of titles and link them but I love the look of the magazine element and would prefer to use it – it looks especially nice with a thumbnail image next to each link.
Thanks,
Scott
Hey!
Have you tried using a color section and then place a content slider inside? I think that is the type of layout your trying to create.
Inside the content slider you can click the “Add Media” button to insert your images with a large choice of thumbnail sizes.
Best regards,
Elliott
-
This reply was modified 11 years, 4 months ago by
Elliott.
Hi Pearwcz!
The images that are created are all thumbnails so their filesize will be very small (depending on where your using them, slider images will be larger). In total it should be only about 300 – 500 extra KB per image you upload.
If you still want to get rid of them though then open up /enfold/functions.php and you can find the sizes starting on line 99.
$avia_config['imgSize']['widget'] = array('width'=>36, 'height'=>36); // small preview pics eg sidebar news
$avia_config['imgSize']['square'] = array('width'=>180, 'height'=>180); // small image for blogs
$avia_config['imgSize']['featured'] = array('width'=>1500, 'height'=>430 ); // images for fullsize pages and fullsize slider
$avia_config['imgSize']['featured_large'] = array('width'=>1500, 'height'=>630 ); // images for fullsize pages and fullsize slider
$avia_config['imgSize']['extra_large'] = array('width'=>1500, 'height'=>1500 , 'crop' => false); // images for fullscrren slider
$avia_config['imgSize']['portfolio'] = array('width'=>495, 'height'=>400 ); // images for portfolio entries (2,3 column)
$avia_config['imgSize']['portfolio_small'] = array('width'=>260, 'height'=>185 ); // images for portfolio 4 columns
$avia_config['imgSize']['gallery'] = array('width'=>845, 'height'=>684 ); // images for portfolio entries (2,3 column)
$avia_config['imgSize']['magazine'] = array('width'=>710, 'height'=>375 ); // images for magazines
$avia_config['imgSize']['masonry'] = array('width'=>705, 'height'=>705 , 'crop' => false); // images for fullscreen masonry
$avia_config['imgSize']['entry_with_sidebar'] = array('width'=>845, 'height'=>321); // big images for blog and page entries
$avia_config['imgSize']['entry_without_sidebar']= array('width'=>1210, 'height'=>423 ); // images for fullsize pages and fullsize slider
You can change them there or delete them.
Best regards,
Elliott
I’ve another question about this icon.
When In select a thumbnail, the thumbnail replace the icon. But the thumbnail is bigger than the icon. How can I change the size of thumbnail?
Best regards
Thomas
Hi ismael,
As you can see I originally was asking if there is a way to remove the featured image from the single product page.
I got two solutions from you guys, the first one didn’t work and the 2nd one changed the lay out of the thumbnail gallery in the single product page and hid the the featured image but didn’t remove it!, if you click on one of the images in the single product page and go through the pictures you’ll end up seeing the 300x150pxl featured image that I want to remove, not hide.
If to make it as clear as I possibly can:
I wonder if there is a way to remove the featured image from the single product page so it is removed from the thumbnails and and so you wont be able to see it if you go through the enlarged images, without changing the thumbnails lay out in the single product page?
regards
Hi everyone.
Great wp theme!
I am trying to create slides that have sidebar over image with recent “featured” posts.
I am struggling to understand how to display small thumbnail instead of full-size post image.
Currently I have this code
<article>
<div class="promotional-featured-article">
<a href="[post-url]"><img src="[image-url]" /></a>
<div class="copy-container">
<h4><a href="[post-url]">[title]</a></h4>
<p>[content]</p>
[date-published]
</div>
</div>
</article>
I have also tried to use [thumbnail] – which is generating link as well but it is the same as [image-url]
Is it possible to achieve that?
Could you advice me please
-
This topic was modified 11 years, 4 months ago by
db-studios.
Does anybody have any ideas on the best way to create an automatically rotating/sliding gallery with say 3 images per page and a custom background? Oh and I need to be able to edit my thumbnail sizes. I have been trying various methods but they have all fell short in achieving at least one of these elements.
I got close by putting a masonry gallery within a color section and achieved the layout and background I wanted but couldn’t make it automatically slide every few seconds, so I abandoned that.
The current method I am pursuing is using the content slider with a gallery within it but I don’t know how to change the background image in the content slider or the size of the thumbnails it displays.
Any help please, it’s driving me mad.
Many thanks,
Hi!
Line 30 in the same file should look like this.
<header class="entry-content-header">
Try adding this beneath it.
<?php echo the_post_thumbnail( 'thumbnail' ); ?>
Regards,
Elliott
Hey chryseis!
Please go to Appearance > Editor and open functions.php file and find
$avia_config['imgSize']['widget'] = array('width'=>36, 'height'=>36); // small preview pics eg sidebar news
$avia_config['imgSize']['square'] = array('width'=>180, 'height'=>180); // small image for blogs
$avia_config['imgSize']['featured'] = array('width'=>1500, 'height'=>430 ); // images for fullsize pages and fullsize slider
$avia_config['imgSize']['featured_large'] = array('width'=>1500, 'height'=>630 ); // images for fullsize pages and fullsize slider
$avia_config['imgSize']['extra_large'] = array('width'=>1500, 'height'=>1500 , 'crop' => false); // images for fullscrren slider
$avia_config['imgSize']['portfolio'] = array('width'=>495, 'height'=>400 ); // images for portfolio entries (2,3 column)
$avia_config['imgSize']['portfolio_small'] = array('width'=>260, 'height'=>185 ); // images for portfolio 4 columns
$avia_config['imgSize']['gallery'] = array('width'=>845, 'height'=>684 ); // images for portfolio entries (2,3 column)
$avia_config['imgSize']['magazine'] = array('width'=>710, 'height'=>375 ); // images for magazines
$avia_config['imgSize']['masonry'] = array('width'=>705, 'height'=>705 , 'crop' => false); // images for fullscreen masonry
$avia_config['imgSize']['entry_with_sidebar'] = array('width'=>845, 'height'=>321); // big images for blog and page entries
$avia_config['imgSize']['entry_without_sidebar']= array('width'=>1210, 'height'=>423 ); // images for fullsize pages and fullsize slider
If you would like to change sizes, please regenerate thumbnails after that using this plugin – https://wordpress.org/plugins/regenerate-thumbnails/
Regards,
Yigit
thanks for the replay.
when i add the code to the quick css it removes the featured image big thumbnail in the product page and when i press to enlarge one of the images and go through the images, the featured image still shows.
I would like to keep the look of the single page as its originally is with one big thumbnail on top and smaller ones under it, only that in the big thumbnail it would show the first image of the product and the featured image wouldn’t show any where on the product page.
thanks
Thank you Josue for all of your replies im so grateful, I just wished that the Masonry Gallery could use a better slider that could be larger,
These videos are ok, but they don’t explain how for me to do things, I want to try and finish this post with you, so i can go ahead and make my site and its tough still not knowing what I’m supposed to do,
what I am trying to do is create, many different galleries, like the masonry Gallery, the idea is on the front page the viewer can see what they want so they might choose America or Bali from the drop down menu, once pressed it takes the viewer to the thumbnails, and then the viewer can look at each image and slide through them if they wish, you said I can so this with a Masonry Element, please could you explain in a step buy step way to help explain this,
Example,
1, Create a page and drag masonry element to it, etc,
what I am confused is, where is the masonry getting the images from? and if I created more than 1 Masonry Elements how do I get them to point to each different set of images,
Thanks for your time, I wish I could host an images to try and explain better for you
Louis