We like the DIVI page builder. It makes page building fun unless the module doesn’t do what you want it to, and then you find yourself struggling to figure how to get it to do what you want. We had this same scenario today with the Person Module. We simply wanted to center the image, but there was no way to do it in image settings. We found our answer here.
Open the “Person” module.
Go the “Advanced” tab
Go down to “Custom CSS“.
Click on the “Module Elements” tab
Go down to “Member Image” and add the following: margin-left: auto; margin-right: auto;
We had a customer with an old Joomla 2.5 site that we got upgraded to Joomla 3; however, we wanted to go to Joomla 4 and couldn’t find the “Joomla Update” menu item under the Components menu. We were able to find it here.
Go to Extensions -> Manage -> Update
Hit the Options button in the upper right
On the left side menu you find “Joomla! Update“, and here you can set the “Update Channel“
We suddenly started getting the Joomla4 error page while building a new site in XXAMP. Our first search on the web lead us to fixing the “data” directory in the “C:\xampp\mysql\data”. We used the following article to help get us started. They offer 3 different methods. We didn’t have “Administrator” privileges on the machine, so we started with method 2 and coping the data. At first this got the MYSQL working again.
We couldn’t get into the website via the Administrator so we need to change the configuration file manually to get us some error messages to debug the site. We used this article to change the permissions on the “configuration.php” file to not be “read-only”.
We like using WordPress to build website and blogs, and we always add some kind of Web Access Firewall to keep it semi-safe. We review the access logs in the Web Access Firewall login attempts to block bad IP‘s. We noticed some of the attempts were old & current employee email addresses and names. Some of the passwords the attackers used were passwords we have seen previous employees used.
This is a good reason to enforce strong password policies. There are a ton of plugins to achieve this, and a bunch of them are free. We realized these attackers had some information regarding our company. It was great to see these login attempts thwarted by simple plugin. This is why it is so important to install something to help. We used RSFirewall for WordPress on the site where we discovered these login attempts. It was a reminder to us, and we want to keep you aware.
We discovered an issue on the customer’s website when someone submitted the contact us form. We would get a bounce back saying the auto responder email address was sent not from the website’s domain. Since the first email from the form went to the customer we knew it does work, but just won’t send the second email.
We contacted the developer and said it was SPF, DMARC or something in that realm that was causing the issue. We didn’t want to mess with the customer’s DNS setting, but something needed to be done. In the customer’s SPF record was one “include” already so we looked up how to add the second. It was very straight forward.
With a older website we needed to fix some Fontawesome issues where the icons stopped displaying correctly. We needed to match their old Fontawesome version 4. The template was set to use Fontawesome 4. All of this needed to be set in the CSS. Here is what we needed in our CSS file.
Okay, maybe not a full blown tutorial just some lessons we have learned. We recently got asked evaluate a website. The site seemed very plain Jane; however, when running Google’s page speed insights we were blown away by the performance. It scored above 90% on everything. We tested a new version of our website and was crushed by the disappointing score. It was time to get to work and learn how to lower the load times, increase the accessibility and SEO scores.
Here are the first test results for mobile and desktop.
The performance scores were terrible. The SEO was so disappointing.
Keep your <h> tags in order
Digging in deep with the browser developer tools. We realized that a simple module we had at the top of the page as an attraction had the text was in wrapped in a “<h3>” tag. This seemed so simple but Google wants your page <h> tags to be in order starting with “<h1>” and working way through the higher / smaller <h2 – 6> tags. Simply moving this module below our “<h1>” tag greatly raised our SEO score. Oh yeah!
Make it link
The other small issue was the navigation bullets in front page slide show didn’t have a destination. The module’s code knew what to do, but the link wasn’t visible to the browser. Simply not having the destination url in the “<a href=””>” tag. We didn’t have a way to control this so we choose not to show the dot-navigation. We switched it to showing arrow on the hover for the user to jump ahead in the slideshow. Time to run another test in Google’s Page Speed Insights.
The results are in
These two small changes super charged our results. Here are the results we got.
We were so please with the results. We still have some work cut out for us, but is good to know we are not so far off. We dug in deeper. We really wanted “Accessibility” and “SEO” to reach 100. “Best Practices” we could work on, but is “Performance” based on the CMS platform? Is that why “Performance” isn’t reaching 100?
Going Deep
We followed the details in each section of the Page Speed Insights and eliminated a few small problems. One of the issues we had was “contrast“. It was pointing to a red button we had on the screen that had white text in it. We thought the contrast was strong, but we used this following link to check the contrast ratio between the background and the text. We needed to change our background color just a little.
We took some the images into Photoshop and got the resolution down. We also cropped the images to fit the space they occupy better. We lost a little quality but took it down to a quarter of their size. Not fantastic, but lets see how it could help.
The next run we are finally hitting the numbers were are happy with. We had to eliminate just a couple of small features, but we are not really sacrificing user experience. Take a look at the results.
We received an email from Google Business Profile for an ownership request. This was a good customer and we wondering if they might be leaving us. We reached out to the customer to verify the request, and found out the customer didn’t request it. Good for us, but very troubling had the request been granted.
Your Google Business Profile is very important to businesses. In the past we have seen customer loose almost all new business when their profile gets suspended. Getting Google to remove the suspension can be next to impossible. As a business owner you need to have this tool under your control.
Our advise for anyone is to respect and appreciate your Google Business Profile and make sure you have ownership over it. We have spent a lot of time with customers who have gotten into trouble and lost their listing or got it suspended. If you get in over your head and need some help feel free to reach out to us for help.
We used Gantry template on our blog since we built the main website using this template as well. It saved us a bunch of time because we were able to use alot of the same CSS. We mainly audit our main site for SEO, but when examining AHREFs full data we noticed all the blog post titles were h2 tags, so the h1 tag was never created for the page.
We ended up having to do an override in the template. Not something we like doing; however, Gantry does make it easy-ish. We did need to edit some template files directly. We used the following forum post to help us.
We are upgrading a Joomla 3 website to Joomla 5 and keeping a Gantry template, and when testing the mobile view we noticed the mobile menu wasn’t showing up. This drove a bit crazy, but we were able to get it resolved. Once resolved we needed to work with the “custom.scss” file to use Media Queries to make it perfect
The secret here is in the layout section of the template click on the gear or options of the Menu Particle. At the bottom of the options you will see “Mobile Target“. This will make this menu the mobile menu. Here is a link to the instructions from Gantry.
