-
AuthorSearch Results
-
September 15, 2017 at 7:35 am #852405
Topic: Add date to portfolio pages (Updated 2017 for Enfold 4)
in forum EnfoldJenkins87
ParticipantHi fellow Enfolders!
I’d like to share with everyone here an updated version on this topic https://kriesi.at/support/topic/add-date-to-portfolio-pages
The steps listed in that thread (now closed) are way out of date (2013) and are not compatible with Enfold 4 and if you try and follow the steps, you’re probably going to break your theme.
The first part is the same, find wp-content/themes/enfold/config-templatebuilder/avia-shortcodes/portfolio.php
This is where it’s different. It’s because the theme has evolved so much since 2013, and now has special IF/ELSE statements for mobiles and the editor previews etc.Find line 560, just above this IF statement;
if($columns == "1" && $one_column_template == 'special')And add the first part to create a dynamic macro of the date above that IF statement;
$portfolio_date = get_the_date($entry->post_date); if($columns == "1" && $one_column_template == 'special')Now scroll down about 30 lines, to 588 at the end of the nested if(!empty($title)) function and add the 4 required lines below;
$output .= "<br>"; $output .= "<span class='post-meta-infos'>"; $output .= "<span class='date-container minor-meta'>".$portfolio_date."</span>"; $output .= "</span>";But wait, we’re not done yet!
Scroll down to about line 642. This is at the end of the second nested if(!empty($title)) function and add the 4 required lines below it;$output .= "<br>"; $output .= "<span class='post-meta-infos'>"; $output .= "<span class='date-container minor-meta'>".$portfolio_date."</span>"; $output .= "</span>";This will now add the full date and time to your Portfolio Grid element that you put on any page or post using the Advanced Layout Builder
The full functions should now look like this;
$portfolio_date = get_the_date($entry->post_date); if($columns == "1" && $one_column_template == 'special') { $extraClass .= ' special_av_fullwidth '; $output .= "<div data-ajax-id='{$the_id}' class=' grid-entry flex_column isotope-item all_sort {$style_class} {$post_class} {$sort_class} {$grid} {$extraClass}'>"; $output .= "<article class='main_color inner-entry' ".avia_markup_helper(array('context' => 'entry','echo'=>false, 'id'=>$the_id, 'custom_markup'=>$custom_markup)).">"; $output .= apply_filters('avf_portfolio_extra', "", $entry); $output .= "<div class='av_table_col first portfolio-entry grid-content'>"; if(!empty($title)) { $markup = avia_markup_helper(array('context' => 'entry_title','echo'=>false, 'id'=>$the_id, 'custom_markup'=>$custom_markup)); $output .= '<header class="entry-content-header">'; $output .= "<h2 class='portfolio-grid-title entry-title' $markup>"; if(!empty($title_link)) { $output .= "<a href='{$title_link}'>".$title."</a>"; } else { $output .= "".$title.""; } $output .= '</h2></header>'; } $output .= "<br>"; $output .= "<span class='post-meta-infos'>"; $output .= "<span class='date-container minor-meta'>".$portfolio_date."</span>"; $output .= "</span>"; if(!empty($excerpt)) { $markup = avia_markup_helper(array('context' => 'entry_content','echo'=>false, 'id'=>$the_id, 'custom_markup'=>$custom_markup)); $output .= "<div class='entry-content-wrapper'>"; $output .= "<div class='grid-entry-excerpt entry-content' $markup>".$excerpt."</div>"; $output .= "</div>"; } $output .= '<div class="avia-arrow"></div>'; $output .= "</div>"; $image = get_the_post_thumbnail( $the_id, $image_size, $image_attrs ); if(!empty($image)) { $output .= "<div class='av_table_col portfolio-grid-image'>"; $output .= "<".$link_markup[0]." data-rel='grid-".avia_post_grid::$grid."' class='grid-image avia-hover-fx'>".$custom_overlay.$image."</".$link_markup[1].">"; $output .= "</div>"; } $output .= '<footer class="entry-footer"></footer>'; $output .= "</article>"; $output .= "</div>"; } else { $extraClass .= ' default_av_fullwidth '; $output .= "<div data-ajax-id='{$the_id}' class=' grid-entry flex_column isotope-item all_sort {$style_class} {$post_class} {$sort_class} {$grid} {$extraClass}'>"; $output .= "<article class='main_color inner-entry' ".avia_markup_helper(array('context' => 'entry','echo'=>false, 'id'=>$the_id, 'custom_markup'=>$custom_markup)).">"; $output .= apply_filters('avf_portfolio_extra', "", $entry); $output .= "<".$link_markup[0]." data-rel='grid-".avia_post_grid::$grid."' class='grid-image avia-hover-fx'>".$custom_overlay.get_the_post_thumbnail( $the_id, $image_size, $image_attrs )."</".$link_markup[1].">"; $output .= !empty($title) || !empty($excerpt) ? "<div class='grid-content'><div class='avia-arrow'></div>" : ''; if(!empty($title)) { $markup = avia_markup_helper(array('context' => 'entry_title','echo'=>false, 'id'=>$the_id, 'custom_markup'=>$custom_markup)); $output .= '<header class="entry-content-header">'; $output .= "<h3 class='grid-entry-title entry-title' $markup>"; if(!empty($title_link)) { $output .= "<a href='{$title_link}' title='".esc_attr(strip_tags($title))."'>".$title."</a>"; } else { $output .= "".$title.""; } $output .= '</h3></header>'; } $output .= "<br>"; $output .= "<span class='post-meta-infos'>"; $output .= "<span class='date-container minor-meta'>".$portfolio_date."</span>"; $output .= "</span>"; $output .= !empty($excerpt) ? "<div class='grid-entry-excerpt entry-content' ".avia_markup_helper(array('context'=>'entry_content','echo'=>false, 'id'=>$the_id, 'custom_markup'=>$custom_markup)).">".$excerpt."</div>" : ''; $output .= !empty($title) || !empty($excerpt) ? "</div>" : ''; $output .= '<footer class="entry-footer"></footer>'; $output .= "</article>"; $output .= "</div>"; }Of course, you will have to style the newly added date-container, minor-meta and post-meta-infos classes, but be careful, the last one is used on practially every post or custom post type showing a date. Use conditional CSS in order to restrict the styling to just a portfolio grid page;
.avia-fullwidth-portfolio .post-meta-infos { color: #333; }etc
Hope this helps others out there looking to add dates back into their Portfolio grids.
In my case, I’ve used Ismael’s excellent guide to change the name of “Portfolio” to something different, effectively converting the Enfold Portfolio system into it’s own Custom Post Type, but still reaping the benefits of using the Enfold Portfolio ;)
https://kriesi.at/support/topic/change-the-portfolio-items-name-in-admin-to-something-else/
https://kriesi.at/support/topic/change-portfolio-directory-name/Cheers, Jenkins
September 15, 2017 at 6:00 am #852402Hi,
Yes, there are no “posts” per se in the site, just portfolio sections and pages. I have tried to disable all blog and comment type functions as this site is not intended to be anything like that.
I am a bit scared to delete those entries as they seemed to refer to images and I am afraid to mess up the rest of the site. I changed all the status entries to “closed”. The hackers seemed to have put two entries in the database which linked to a viagra site and some sunglasses sites and they used that post method to appear in google search and then (in google) if you clicked you got to that site rather than ours.
If I google search now they are no longer appearing so hopefully that is sorted, I was just hoping there was a global way to disallow those sort of links. There are not many links on the site so it is relatively easy to control that, unlike a blog with lots of posts and comments! The only issue was that google seemed to have stored a bunch of those “domain/post_name” links, obviously the hacker modus operandi. At least now they seem to get to that “blog” page (as per hidden links above).
I hoped that that “blog” page that comes up now with the image thumbnail could be somehow replaced by something else or a redirect. I am not sure what that page is or how created but it seems to be a wordpress thing. I was hoping it was an enfold thing that you might recognise.
Is there a recommended security plug-in (eg wordfence?) that is good with enfold?
Thanks
September 14, 2017 at 7:53 am #851890In reply to: Woocommerce catalog images not using scaled images
Hey esaunders,
Thank you for using Enfold.
Are you using the “Product Slider” element? This element is using the “portfolio”, “portfolio_small” and “large” thumbnail sizes, depending on the number of columns. Please install the following plugin if you want to resize the thumbnails.
// https://wordpress.org/plugins/simple-image-sizes/
Best regards,
IsmaelSeptember 14, 2017 at 1:01 am #851795In reply to: Masonry CSS Classes
Back again :)
The Result:


I use following settings
#Portfolio Raster / 3 Rows / Medium 300×300 / Yes, display sort options
And here is the css code for free :)/* Portfolio Raster */ .grid-content { display: none; } .sort_width_container { display: block; margin: 20px 0 40px !important; padding: 0; text-align: center !important; } #js_sort_items { display: inline-block; text-decoration: none; } .sort_by_cat a { background: #000 none repeat scroll 0 0; border: 2px solid #000; color: #fff; display: inline-block; font-size: 12px; letter-spacing: 1px; line-height: 1; margin-bottom: 3px; margin-right: 4px; padding: 13px 20px; text-transform: uppercase; } .sort_by_cat a:hover { transition: all 0.4s ease-in-out 0s; background: #fff; border-color: #000; color: #000 !important; } .avia_transform a .image-overlay { transition: opacity 0.4s ease-in-out 0s; } .image-overlay.overlay-type-extern .image-overlay-inside::before { content: ""; font-family: "entypo-fontello"; font-size: 40px; } .image-overlay { background: #000 none repeat scroll 0 0; }But i have one problem:
Why are the images blurred? I have different images sizes. All images are blurred.Best Regards
Christian-
This reply was modified 8 years, 7 months ago by
Kingsfield.
September 13, 2017 at 11:11 pm #851762In reply to: Picture Quality
Hey gharry79,
The masonry images are resized to a max width and height of 705x705px in the functions.php file. You can increase the px value then regenerate the thumbnails:
$avia_config[‘imgSize’][‘masonry’] = array(‘width’=>705, ‘height’=>705 , ‘crop’ => false); // images for fullscreen masonry
Use this plugin to regenerate the thumbnails: https://wordpress.org/plugins/regenerate-thumbnails/Best regards,
Jordan ShannonSeptember 13, 2017 at 8:02 pm #851705jholtdesign
ParticipantWhen I try to post my site URL to Facebook to include a thumbnail image, I get a carousel of images below it. Some are from the Avia Layout Builder backend that don’t even show my sites content and there is an image that is not even in my media library that also appears. How can I fix this and just show a single image when I post the URL to Facebook? The site is: http://www.be-wellcoaching.com. If you go to Facebook and type the URL in a post you can see the images that appear. I would like the image from the top layerslider to appear. I have installed Yoast SEO but that didn’t change anything. Thank you.
September 13, 2017 at 5:13 pm #851666Topic: woocommerce images on single produkt side
in forum Enfoldbretzaustria
Participanthi,
I’m very happy with enfold, but I’m unhappy in the way woocommerce shows single products
I did some tests with plugins and inserted php code and I’m able to built a side that I can use as a template for products. thats all fine with me but I’m still unhappy with the product images and the way it shows the thumbnails.So, I know I can use enfold galleries or some other media elements in product pages, but I when I use them, I have to do it in every single product page.
Is it possible to use a enfold gallery or slider in a page that I use as a template for single produtcs so the gallery or slider automatically use the pictures of the product?
or do I need a customisation for this?thx
September 13, 2017 at 4:01 pm #851620In reply to: Blog view "single-small" thumbnail size
Hi Ismael,
thanks for your reply!I changed the css sizes the following way, so that I get a 16:9 format, also adjustet the timeline line and regenerated the thumbnails:
/* Blog View single-small Thumbnails & Timeline & Overlay */ .small-preview { width: 195px !important; height: 100px !important; line-height: 195px !important; } .post_author_timeline { right: 99px !important; } div.blog-meta .image-overlay .image-overlay-inside { top: -3px !important; } div.blog-meta .rounded-container .iconfont, .small-preview .iconfont { font-size: 30px !important; top: -48px !important; }That’s what I wanted – thank you very much!
Best regards,
NeverlandsSeptember 13, 2017 at 1:43 am #851308I have no caching plugin or CDN at all and it still doesn’t work guys.
To clarify again, the issue I am finding is from the Product page. If you click the add to cart button on the Product page, the cart icon does not appear then or when browsing any other page.
It does appear temporarily when you click Add to Card from a Product thumbnail on the category or other pages.
Can either of you clarify this specific scenario?
Jason
September 12, 2017 at 11:24 am #850951Hi Jordan,
Thank you for the reply. I used this filter in functions.php:
add_filter( 'post_thumbnail_html', 'wpb_autolink_featured_images', 10, 3 ); function wpb_autolink_featured_images( $html, $post_id, $post_image_id ) { $html = '<a href="' . get_permalink( $post_id ) . '" title="' . esc_attr( get_the_title( $post_id ) ) . '">' . $html . '</a>'; return $html; }but unfortunately that adversely affects the “Related Posts” section at the bottom. I’ve commented out that code for now. Any ideas?
Thanks!
-
This reply was modified 8 years, 7 months ago by
ecdoesit.
September 12, 2017 at 8:16 am #850841In reply to: Magazine Content Element
Hi,
Please replace the code with:
$output .= 'Posted in: ' . $cats;For the border issue, please replace the css code with the following.
.av-magazine-thumbnail { width: 120px; height: 80px; } .av-magazine-thumbnail a { width: 100%; height: 100%; } .av-magazine-thumbnail img { width: 100%; height: 100%; }You may find the thumbnails distorted so you have to adjust the default size of the Settings > Media > Thumbnail image. Save then regenerate the images.
// https://wordpress.org/plugins/force-regenerate-thumbnails/
Best regards,
IsmaelSeptember 11, 2017 at 10:37 pm #850702Topic: Blog view "single-small" thumbnail size
in forum EnfoldNeverlands
ParticipantHello,
I would like to change the size of the thumbnails in the “single-small” blog view.
At the moment they are 180x180px scaled to 81x81px.I would like them to have a width of 100px without scaling and a 16:9 format.
Giving the “sqare” image format a new crop size (I use the plugin “Simple Image Sizes“) does not change the output scaling of 81px width and the thumbnails do not fit the overlay anymore.
Best regards,
NeverlandsSeptember 11, 2017 at 3:36 pm #850549In reply to: Increase size of posts category page thumbnails
Hi,
It is cropped to be square. If you would like to change it, please try the following:
1. Install this plugin: https://wordpress.org/plugins/simple-image-sizes/
2. Go to Settings > Media
3. Change thesquareimage size (increase its width / height).
4. Regenerate the thumbnails by clicking the button at the bottom.Best regards,
YigitSeptember 11, 2017 at 3:12 pm #850534Hi,
Have you regenerated thumbnails after adding the code to functions.php file? If not, please do so – https://wordpress.org/plugins/regenerate-thumbnails/ as image size is still small at the moment.
Best regards,
YigitSeptember 11, 2017 at 2:33 pm #850520In reply to: Magazine Content Element
Apologies, I made the changes to a different URL – see private (forgot to update you) – you should be able to see the thumbnail issue on that URL.
Can you advise the line of code that I should use that won’t break the php file?
Should it be as follows?$output .= 'Posted in' $cats;Thanks,
Sam
September 11, 2017 at 2:07 pm #850495In reply to: Logo is not displaying in full
Hi Again
I solved the problem by copying the link from the media library and replacing the link in the Enfold Theme Options settings. For some reason when I uploaded the logo in the Theme Options, it was cutting it to an 80 x 80 thumbnail… you may want to check why this is happening…
kind regards
JonathonSeptember 11, 2017 at 9:36 am #850393In reply to: Vertical separator between 5 columns
Hi Jordan ,
Sorry I have been working a lot on this draft page, so thing might have changed a bit.
On the following page (http://deli-vers.nl/?page_id=8431&preview_id=8431&preview_nonce=451a7ef78d&_thumbnail_id=-1&preview=true) I would like to create 4 small vertical separators on the first line of the page. ( after: maandag 18.09, after dinsdag 19.09, after woensdag 20.09 and donderdag 21.09).Is that possible?
Many thanks, Alexandra
September 10, 2017 at 8:08 pm #850188In reply to: Slider with thumbnails
Hey zimbo,
You are correct that the Enfold sliders don’t have thumbnail functionality, and the gallery thumbnail animation do not auto-rotate.
For easy use you can probably find a free WP plugin for your client, WP Thumbnail Slider looks easy. Here’s a article about 11 Excellent Free Responsive WordPress Slider PluginsBest regards,
MikeSeptember 10, 2017 at 6:49 pm #850170Topic: Slider with thumbnails
in forum Enfoldzimbo
ParticipantI’m developing a new page and need a slider that auto-rotates and has thumbnails underneath that are clickable to ‘jump ahead’ if wanted. I know LayerSlider can do this (I’ve tested it) but the slider seems quite complicated and this new page will be edited by non-technical people so I’m concerned about ease of use. Hence seeking another solution.
It appears that none of the Enfold sliders have thumbnail functionality – is this correct? If one does, can you please tell me which one to use and how to set it up?
I’ve also looked at the Gallery element but, despite a setting implying I “can set when the gallery thumbnail animation starts”, I cannot get it to work and the thumbnails and main image do not auto-rotate.
Ideas please as to how I can achieve what I want…?
September 10, 2017 at 5:54 pm #850159In reply to: Thumbnails and submenu
Hey again,
I just realized that the thumbnail image comes from the Featured Image in the Portfolio Item page. Now I’m wondering if there’s a way to not repeat the thumbnail image once it is selected, and it goes to the image gallery or slideshow or list?
September 10, 2017 at 5:23 pm #850152In reply to: Thumbnails and submenu
Hey,
I’m actually building it locally for now, so there isn’t a way I can share a link. Can I share a screenshot? I’ll just explain as best I can. In the portfolio grid on the portfolio page, there are only narrow boxes with the title of the portfolio items, and no thumbnail. In the Portfolio Item, I have added a number of preview images, including a small thumbnail image (450px x 335px), similar to what I did with the Angular theme. In the Portfolio Grid settings, for Portfolio Grid Image Size, I selected Choose the Portfolio Grid Size manually, and for Select Custom Image Size, I chose No Scaling. For Link Handling, I chose AJAX. Any ideas why the thumbnail isn’t showing up? Also, I was able to figure out the subnav issue.
September 10, 2017 at 11:40 am #850099In reply to: Magazine Content Element
Thanks Ismael.
The CSS worked great and I’ve decided not to use the read more link (eats up page space) but thank you for advising.
I couldn’t work out how to add ‘Posted in’ to the line of PHP in magazine.php – every time I edited the file, it broke the site entirely so I had to revert back. Could you perhaps advise the exact code I need to use please?
Also, I tried to adjust the width/height of the thumbnail image for the magazine element (using CSS I found from one of your colleagues in the forum);
.av-magazine-thumbnail img, .av-magazine-thumbnail {
width: 100px !important;
height: 80px !important;
}However, the border around the thumbnail breaks when you do this – see my website homepage (details in private) to see what I mean – the border around the base of the thumbnail needs increasing… can you advise please?
Thanks,
Sam
September 10, 2017 at 7:54 am #850055Topic: Thumbnails and submenu
in forum Enfoldjoschro
ParticipantHello,
I just downloaded Enfold and it’s a great theme! I have a couple questions:
First, how can I get the thumbnails to show up in the portfolio grid? Right now only text is showing up.
Second, the submenu on the Portfolio menu item is way too big. How can I make it a regular size so it looks good, like in the demo site? I want to add the portfolio categories as submenu items.September 10, 2017 at 6:32 am #850046In reply to: Original Image size won't display
Thanks Rikard.
When uploading the original image file, and trying to place it – it won’t display, and the thumbnail is blank – unless I choose ‘medium’ ‘large’ etc. So the original higher res images just aren’t there – does that make sense?
regards
September 9, 2017 at 3:39 pm #849952In reply to: Increase size of posts category page thumbnails
Ismael, here is screenshot:
http://www.maryhellen.it/screenshot-thumbnail-cropped.jpgThanks
September 9, 2017 at 6:58 am #849861Hey stakavainio,
Please try this instead:
@media only screen and (max-width: 767px) { .ls-thumbnail-slide { display: none !important; } }Best regards,
RikardSeptember 9, 2017 at 5:52 am #849842In reply to: Increase size of posts category page thumbnails
Hi,
The second css declaration is for the “timeline”.
is it possible to not to make thumbnail croped (as in “Ansia e stress” post thumbnail), but only resized?
I’m sorry but I’m not sure what you mean by that. Could you please provide a screenshot?
Best regards,
IsmaelSeptember 9, 2017 at 4:46 am #849811In reply to: Image sizes
Hi,
Please install the following plugin then go to the Settings > Media panel. Adjust the size of the “entry_with_sidebar” and “entry_without_sidebar” thumbnails, save, update then regenerate the thumbnails. The default sizes of those are thumbnails are 845x321px and 1210x423px respectively.
// https://wordpress.org/plugins/simple-image-sizes/
Best regards,
IsmaelSeptember 9, 2017 at 1:05 am #849778In reply to: Increase size of posts category page thumbnails
Thanks, it does work. I have a 2 more questions:
– what affects second block of code.multi-big .post_author_timeline, .single-small .post_author_timeline { left: 90px; }?
and
is it possible to not to make thumbnail croped (as in “Ansia e stress” post thumbnail), but only resized?
Thanks-
This reply was modified 8 years, 7 months ago by
maryhellensegatta.
September 8, 2017 at 8:17 pm #849712In reply to: Portfolio theme
Jonah
GuestTerrific! I did have another question. In the Portfolio options that are not Ajax, such as 2- or 3-column, if you click into a portfolio item thumbnail, is there a close button to get back to the main portfolio thumbnails page? Or would you have to use the browsers back button or the Portfolio menu item in the top navigation?
Regards,
Jonah -
This reply was modified 8 years, 7 months ago by
-
AuthorSearch Results
-
Search Results
-
When I try to post my site URL to Facebook to include a thumbnail image, I get a carousel of images below it. Some are from the Avia Layout Builder backend that don’t even show my sites content and there is an image that is not even in my media library that also appears. How can I fix this and just show a single image when I post the URL to Facebook? The site is: http://www.be-wellcoaching.com. If you go to Facebook and type the URL in a post you can see the images that appear. I would like the image from the top layerslider to appear. I have installed Yoast SEO but that didn’t change anything. Thank you.
hi,
I’m very happy with enfold, but I’m unhappy in the way woocommerce shows single products
I did some tests with plugins and inserted php code and I’m able to built a side that I can use as a template for products. thats all fine with me but I’m still unhappy with the product images and the way it shows the thumbnails.So, I know I can use enfold galleries or some other media elements in product pages, but I when I use them, I have to do it in every single product page.
Is it possible to use a enfold gallery or slider in a page that I use as a template for single produtcs so the gallery or slider automatically use the pictures of the product?
or do I need a customisation for this?thx
Hello,
I would like to change the size of the thumbnails in the “single-small” blog view.
At the moment they are 180x180px scaled to 81x81px.I would like them to have a width of 100px without scaling and a 16:9 format.
Giving the “sqare” image format a new crop size (I use the plugin “Simple Image Sizes“) does not change the output scaling of 81px width and the thumbnails do not fit the overlay anymore.
Best regards,
NeverlandsTopic: Slider with thumbnails
I’m developing a new page and need a slider that auto-rotates and has thumbnails underneath that are clickable to ‘jump ahead’ if wanted. I know LayerSlider can do this (I’ve tested it) but the slider seems quite complicated and this new page will be edited by non-technical people so I’m concerned about ease of use. Hence seeking another solution.
It appears that none of the Enfold sliders have thumbnail functionality – is this correct? If one does, can you please tell me which one to use and how to set it up?
I’ve also looked at the Gallery element but, despite a setting implying I “can set when the gallery thumbnail animation starts”, I cannot get it to work and the thumbnails and main image do not auto-rotate.
Ideas please as to how I can achieve what I want…?
Topic: Thumbnails and submenu
