Forum Replies Created
-
Posts
-
Big thanks to Arno Weterings who is the author of Arnoweterings speed and performance optimisation for Enfold
Arno and I have been speaking regularly about Enfold Speed and Performance for the past few years. He forwarded me an enquiry from the website owner in need of assistance optimising a self built Enfold site.
Ligety Weibrecht Ski Camp Mt Hood Oregon USA
The site had some major configuration issues – using Cloud Flare DNS which was incompatible with their hosting providers Varnish Cache. I removed Cloud Flare and several premium plugins saving the customer over $150 per year in licenses.
Conducted a full site review and performance analysis
Removed Cloud Flare and reset the DNS back to Dream Host
Fixed a compatibility problem with Caching so Varnish Cache worked properly
Updated and licensed Enfold (over 2 years out of date!)
Upgraded to the latest Paypal payments plugin
Redrew the logo so a higher res copy could be used
Deactivated several unused or incorrectly configured plugins
Rebuilt every page on the site using Enfold best practice
Added over 500 lines of code to functions.php to optimise Enfold and WordPress
Ran a database optimisation
Added WebP
Removed Enfold auto generated image sizes and added new ones for srcset
Added social share imagery
Added missing H1 tag and intro paragraph to home page
Tidied up WooCommerce pages
Removed redundant custom css and functions.php codeThe Results
The site now runs extremely well and no longer lags through WP-Admin. It was almost unusable with server timeouts and disconnect errors when I started.The site scores up to 97/100 in Google Web Vitals mobile speed testing
As a UK based business I’d like to extend my thanks to Gary at Ligety Weibrecht who has been extremely trusting of me to get this work done properly and legitimately remotely. The company is based over the other side of the pond in the USA.
Worked perfectly thank you.
Hi Ismael,
THank for your the info. I’ll take a look and see if I can tweak the function.
I suddenly realised I raised this ticket twice. Sorry.
Gunter has sent me a solution using a new function to disable Srcset per element. Because I have some good image compression it has resulted in no change to the site speed and performance testing. Really pleased.
@Günter
Thank you for this. Does exactly what I needed it to.
On https://www.place4acase.com launched today – The Full Width Easy Slider on the home page no longer uses Srcset.
Because I have uploaded a compressed image and use EWWW to produce a WebP version and further compress the Jpg version there is no impact on speed and performance. 95/100 under lab testing.
Really pleased with the outcome thankyou.
I’ll enable this feature on a few of the other sites that use the same element on the home page.
Thanks Guenni007.
Sorry an oversight on my part. I didnt look at the tags properly its obviously a apache mod_headers not a html tag!
I’ll try this out on a couple of sites.
Thanks for confirming :)@guenni007
Nice work on this.I see warnings in Web Vitals about this under best practice.
Did you just insert this code into the header on every page?
THP Studio.
Agree the continued work of the team has been fantastic!
I hope it continues because Enfold still stands up as a fantastic platform to build sites on (not to mention the 50+ sites I have running it!)
THP Studio
Very simillar points raised. Thank you for highlighting your previous post.Your point about the Tabs and hiding them is an interesting one. I personally dislike the WooCommerce page layout and feel the tabs should be full width below the product image and summary. This is like Amazon and most other sites.
I have a site in progress that I will share once live that uses the official Woocommerce vertical accordion / vertical tabs plugin. It makes a massive difference to the page layout. I have been able to massively simplify the layout on a customers site.
Changed the order of the elements – Moving the short description downwards.
Thanks Rikard,
If anyone finds this thread via google – On the note of having a second menu in the header area. There is a solution on the documentation using a widget area
But it would be great to have a solution built in to Enfold that uses actual wordpress headers instead of a widget.Technically this would work:
https://kriesi.at/documentation/enfold/example-of-stacked-logo-menu-and-widgets/
And include a menu widget in this area. Not sure if this would give full mega menu capabilities or not though without trialing it.Another launch a few weeks ago for Cherish Keepsakes
CherishKeepsakes Memorial Jewellery Maker Derbyshire UKCherish Keepsakes make sentimental jewellery that can include DNA items like loved ones ashes, breast milk, hair, wedding flowers and pet fur. The memorial items are cast in UV stable resin in a range of colours and designs.
The owner created the logo in Canva so we converted it from an SVG into an EPS and AI file for more portable use.
The font from the logo was also recovered, purchased and used as a custom font on the website.Built on an optimised version of Enfold with WooCommerce. The site uses Paypal to take payments. We included Trust Index Review Aggregation servie to display reviews from their other selling platforms on the site and Smash Balloons Instagram Plugin as a live gallery of work.
The site includes modifications to WooCommerce:
-Add widget to main menu area so search bar is available on desktops
-Add a widget to the top of the product page so search can be added to mobile pages
-Modified search so it only searches products and includes SKUs
-Changed the breakpoint so the sidebar disappears on tablets
-Seperate the categories from the main shop loop for better navigationPagespeed and Web Vitals
The home page under testing scores up to 99/100 in Google Web Vitals mobile device testing and 100/100 on desktops.
This is the fastest WooCommerce website we have launched and this is largely down to the way the images are displayed (no slider).The Think Jarvis optimised web framework includes some extra optimisation:
– VPS hosting with maximum resource allocation from IONOS
– Unique modifications to .htaccess and functions.php
– Caching plugin
– Additional image thumbnail generation
– WebP image generation and compression
– Login screen moved and password protected to prevent brute force attacks
– Jetpack Brute Force Protection
– Advanced contact form spam protection without using Google Recaptcha@envatotastic9
Nice to see another British website on the Enfold Showcase. Nice job!A little bit of advice – Your cookie policy / pop-up implimentation is not GDPR compliant.
As far as I can see your Facebook Pixel and Google Analytics cookies load on page and there is no option to opt in or out from the pop-up. Users must explicitly opt-in to this from your cookie pop-up.
Enfold’s built in tools can do everything apart from record consent. Generally recording consent is a premium feature for cookie plugins but means Enfold can meet most of the requirements of GDPR if you are not worried about recording consent.You can add both Facebook and Googla Analytics tags into the Enfold Control Panel under Google Services. You can then re-word the cookie popup to cover tracking cookies rather than Google Specifically.
I hope this helps.Otherwise I’d recommend going for a full compliance and using a plugin that includes recording consent.
This also helps improve site speed because the tracking scripts do not run until the user opts in.
Thanks Mike / Steve,
Really appreciate the fast response.
I’ll try the fixed code when I am next working on the clients site.Thanks for highlighting the issue with Safari and Caching its been a pain to deal with when some of my clients dont own laptops. Safari on Tablet (older versions in particular) has some serious issues with checking cache age thats for sure! Normally on mobiles a swipe down action in the browser will do the job but not every time.
Its something to do with the combination of options selected within the slider.
Found it!
Use first slides caption as permanent captionIf you turn this on the button links stop working in version 5.0.
Try that on your test server. You can now see the button is working on my example site.
Please can you add this to the bug fix list for version 5.1
It seems to only be a problem if it is the first element on the page.
You could see the issue on the link I sent over though right? Its not possible to click the button.
@Rickard
Really sorry I cant leave the link active for much longer If you try the private data link I sent and the link has been removed it is because the client has woken up for the day.I can leave it active for a few hours more just yet.
@Rikard
I can reproduce this issue.
Buttons on Easy Slider and Full Width Easy Slider are not working.The link address is there but the element is not clickable.
Hi Gunter,
I think what you are suggesting should solve the problem
As per guenni’s screen shot above.
Making it so the font size specified in the special heading (and all headings) only apply to the screen size specified would make sense – instead of becoming the new default size.
Then all other screen sizes are the default size as set by the theme OR as set in the new typography settings.New Size options
As a pro feature I would probably use extra percentage based sizes however scale from desktop to mobiles is not uniform so percentages never seem to work too well vs px sizes. The percentages are based on screen width desktop is 16:9 and mobiles are 9:16. So percentage driven often means the fonts are too small on mobiles when they scale down. I normally use px values for each screen size because of this.I wouldnt complain if there were more options. A Pro users being able to type in a figure and unit would be preferred as an extension to the existing options – better for developers than more dropdown options.
Thanks @Guenni007
The issue is simple when you set the sizes you expect it to only affect those screen sizes and the “Default” for all other screen sizes should be the theme default OR the styles specified in the new Enfold > General Styling > Typography tab. The logic isn’t right at the moment.
This is a new change in the most recent versions of Enfold. The problem only started to occur when I moved to the latest version.
It used to work as expected but now as Guenni007 has pointed out the Default size is now the desktop size which is really silly.
@Rikard
Do you have enough to understand the issue here?I just want to add – I have over 50 Enfold licenses / sites with another 15 in progress and in about half of the cases I did not specify font sizes for the smaller screens. This means I will have to go through every heading on every page and explicitly state font sizes – Its going to take an extremely long time and is caused by a recent change in the logic.
I can see the problem.
It thinks the menu is a six column and a three column when they are infact two columns and one columns. You can see it in the screenshots in the previous post.
It automatically sets an offset based on what I assume is how close the item is to the edge of the screen to prevent it shooting off:
All of the mega menus are Right aligned by default. So I have changed the ones causing problems to left aligned using the following code:
I must add, this wont work on smaller screens – So must be media query driven. Otherwise a wide menu will shoot off the page to the right.
@media screen and (min-width:1441px) { #header #menu-item-87 .avia_mega_div { left: 0px !important; right: auto !important; } }Hi Ismael,
Thanks for taking a look. I have screenshot the issue and highlighted the automated code that is causing the issue.Its affecting every site that has a mega menu when ran on a standard 1920px wide monitor. But the break point where the problem occurs varies depending on the length of the menu. It is auto-calculating an offset somewhere but it is getting it wrong.
When you jump down to 720p (1366px) it is fine. It is just HD desktops.This did not occur until one of the 3 latest versions of Enfold. I think it was 4.9.2.1 where this first started happening.
Take a look at the screen shots and let me know what you think.
Here is a new site we developed for UK Cyber Security Ltd
Cyber Essentials and IASME Governance Provider East MidlandsUK Cyber Security Ltd is a Cyber Security and IT Management company based in Swadlincote, Derbyshire, UK. They are a Cyber Essentials and IASME Governance Certification Body, offering a range of IT security services including penetration testing and network scanning.
The company had lost the original copy of their logo so we recovered their logo and fonts ready for use on their new website.
Built on an optimised version of Enfold with WooCommerce and TakePayments integration. The site includes a bespoke quote generator built using Cost Calculator WordPress purchased from Theme Forest / Code Canyon.
The site includes modifications to WooCommerce:
-Add widget to main menu area so search bar is available on desktops
-Add a widget to the top of the product page so search can be added to mobile pages
-Modified search so it only searches products and includes SKUs
-Changed the breakpoint so the sidebar disappears on tablets
-Seperate the categories from the main shop loop for better navigationPagespeed and Web Vitals
The home page under testing scores up to 93/100 in Google Web Vitals mobile device testing and 100/100 on desktops.
This is because the quote generator loads some files on every page a small tradeoff for extra functionality.The Think Jarvis optimised web framework includes some extra optimisation:
– VPS hosting with maximum resource allocation from IONOS
– Unique modifications to .htaccess and functions.php
– Caching plugin
– Additional image thumbnail generation
– WebP image generation and compression
– Login screen moved and password protected to prevent brute force attacks
– Jetpack Brute Force Protection
– Advanced contact form spam protection without using Google RecaptchaAnother site launch this week.
Bespoke wooden furniture maker
Cedar Design Studio is an Etsy seller who was looking to set up an ecommerce website so they could sell direct alongside their other listings.
The company is a hand made wooden furniture maker based in Ashbourne, Derbyshire, UK. They specialise in hand made wooden desks with hairpin legs and also make bookcases, tv units and coffee tables to order.
The website is of course based on a modified version of Enfold with WooCommerce installed. The site uses Stripe for payments and the WooCommerce Extra Product Options plugin from Theme Forest/Code Canyon.
I can highly recommend this plugin as a great way to manage products with multiple variations (Where SKU codes do not matter). Each Desk has around 1400 variations so it would have been time consuming to use the built in variations options vs using the plugin to manage them centrally.The site includes modifications to WooCommerce:
-Add widget to main menu area so search bar is available on desktops
-Add a widget to the top of the product page so search can be added to mobile pages
-Modified search so it only searches products and includes SKUs
-Changed the breakpoint so the sidebar disappears on tablets
-Seperate the categories from the main shop loop for better navigationEnfold has been optimised using our standard setup for Enfold and WooCommerce. This includes changes to functions.php
The site scores up to 95/100 in web vitals testing.
One more today:
Towards the end of last year I produced a new site for StruServices a Tekla Steel Detailing and Bim Specialist in Burton On Trent, UK. They specialise in Steel detailing for the construciton industry.The company had an outdated WordPress website – Pre mobile design whcih needed modernising. Think Jarvis created a new website taking advantage of the Youtube embed options within Enfold. We also re-drew their logo – future-proofing their business going forward.
To prevent CLS shift we added bespoke media queries for the height of the above the fold images.
The site scores up to 92/100 in web vitals testing
Our standard Enfold performance stack includes:
bespoke .htaccess settings
bespoke functions.php settings
Font pre-load
Script merge and minify
Caching
Srcset with additional image sizes added
WebP image generationAnother happy customer
Think Jarvis designed a new website for HD Prestige Valeting. A Car detailing and ceramic coating specialist based in Swadlincote, Derbyshire UK.You can see the site here: HD Prestige Valeting – Car Detailing and Ceramic Coating Specialist
The site includes pricing tables, a Smash Balloon instagram feed and Facebook Chat Widget.
Smash Balloon has been optimised by setting it to only load with the shortcode. We also use a lazy load module to reduce the performance impact of having a feed on the home page.
over the next few weeks the site will be getting a WooCommerce upgrade. HD Prestige have launched their own range of car cleaning products available to buy online and at their valeting workshop. More to follow!
The site scores up to 96/100 in web vitals testing
Our standard Enfold performance stack includes:
bespoke .htaccess settings
bespoke functions.php settings
Font pre-load
Script merge and minify
Caching
Srcset with additional image sizes added
WebP image generationAnother site live
We recently upgraded Harrison Garden Services website to include WooCommerce functionaility. Pending payment information. Harrison Garden Services are based in Burton On Trent Staffordshire and provide landscape gardening services to the surrounding area. We designed a brand new site for them based on Enfold and a logo which is now used on all of their vehicles.
Our custom Facebook chat icon has been implemented to help convert enquiries with no performance impact.
The site uses our optimised WooCommerce setup:
Widget area added to the top of the shop loop so search and filters appear on mobiles
Sidebar break points adjusted for better tablet experience
Search bar altered to only include productsThe site scores 91/100 in web vitals testing
Our standard Enfold performance stack includes:
bespoke .htaccess settings
bespoke functions.php settings
Font pre-load
Script merge and minify
Caching
Srcset with additional image sizes added
WebP image generationAnother few sites designed in Enfold now live:
MJF Training is a plant equipment training provider based in Staffordshire, UK. They specialise in CPCS, NPORS and NVQ training. Helping people achieve their Trained Operator (Red Cards) and Competent Operator (Blue Cards). The company offers a wide range of training courses including excavator, dumper truck and backhoe operation training.You can visit the site by following the link below:
MJF Training Plant Equipment Training and Testing StaffordshireThink Jarvis was asked to design a new logo and use content from their previous company site to create a modern web presence. The site has been submitted to Google and Bing along with local listing setup to help the site get off the ground quickly.
The site scores 93/100 in web vitals testing
Our standard Enfold performance stack includes:
bespoke .htaccess settings
bespoke functions.php settings
Font pre-load
Script merge and minify
Caching
Srcset with additional image sizes added
WebP image generationThis is a bug with Enfold and affects all Enfold sites
I have replaced the lines on the example site
Fixed by adding your code. See source I commented out the original so it is still there.The cause is
Enfold/config-woocommerce/config.php on line 2999
and
Enfold/config-woocommerce/config-356.php on line 2493Please can you add your fix to the next release?
