Convert Visual Composer Based WordPress Theme for speed

Each week we answer one or multiple Upwork job vacancy questions here on WP Villain. Here is Post I on a WordPress theme built with Visual Composer that has become slow and needs to be converted into a faster site with a better theme setup.

We are currently running a WordPress theme that was heavily modified CSS and utilizes Visual Composer. We need someone to remake a theme using the design we currently have that does not use VC or performs better for Google speed.

Visual Composer

Visual Composer is a great page builder to quickly set up beautiful pages but it takes up a lot of space with short codes and special tags, embedded code, scripts an such. And all this in the end makes many pages on WordPress websites very slow. And, if you ever want to move away from them you are stuck with a lot of custom code tags in your posts and pages that won’t work anymore and will just be printed. It also often conflicts with plugins like Yoast SEO or at least has in the past. That is why we decided a long time ago to dump Visual Composer and either go for a custom code theme or use better page or site builders such as Elementor or Oxygen.

Migrating from Visual Composer

Migrating from Visual Composer to another page builder or simply the WordPress WYSIWYG Editor or Gutenberg is painful. This as it will leave behind all its short codes. And all the functionality that was loaded with it will disappear. So always do this with a local copy and clean it up and find replacement for what was used before.

Theme Choice

You will be able to choose a new turnkey theme or start out with a custom theme, a theme from scratch. The latter is better as you will be able to customize all but will require a lot more work as all will be custom. The former is set up for a large part already so will give you a head start.

Sage Starter Theme

The Sage starter theme is a wonder base theme that works well with many CSS frameworks such as Tailwind, Bootstrap and Foundation, works with a Laravel style file system and view caching and that allows to quickly build solid themes that load fast. It also has built in tools to optimize code, images and concatenate and minify ll the code to loads things way faster. So this would be an option. But it would require quite a bit of work to convert heavily Visual Composer customized pages into custom theme pages. And there may not be budget for that.

Jupiter X and Elementor

With the Jupiter X theme and Template and the use of Elementor Page Builder we would be able to build better pages more quickly that should also load better. Jupiter X offers many templates out of the box that are a great start for many businesses. They also offer a nice range of plugins that make our lives easier. Plugins to add custom post types, custom fields, sliders and much more. It would still take quite some time, but probably less than doing a theme from scratch. Will it be better? It will be better than your VC setup for sure, but the Sage setup will be better and faster.

Choices to make

So what should you choose? A custom theme, one with Sage working with us or a ready made theme we will customize into a site like your current with Elementor? Well, that depends on the budget. A Sage set up will be more work as it will be a new customized theme, possibly using Elementor or Advanced Custom Field, but built form scratch. When you start with Jupiter X you will have a base and styles to work with and you can customize those. You should have an advantage with existing layouts. This depends on how close your base template is to the site you currently have though.

Main Take

So can Jupiter X match site quite well layout wise and or style wise? Well, if so go for that. If not go for the Sage starter theme. We believe in the end Sage will pay off as it will be tailor made, swift and completely as you want it. With Jupiter X as you have a base and several plugins including a page builder that is always somewhat tougher and you are more limited by the foundation you start with. Sage is more of a clean slate you can tailor to your satisfaction.

Mailchimp Comment Optin – Fixing Outdated Constructor Error

Mailchimp Comment Optin is a plugin we still use for some of our clients. Fixing Outdated Constructor Errors is needed to work with it properly. The error you get will be:

( ! ) Deprecated: Methods with the same name as their class will not be constructors in a future version of PHP; MCAPI has a deprecated constructor in /srv/www/domain.com/current/web/app/plugins/mailchimp-comment-optin/lib/classes/MCAPI.class.php on line 3

This refers to an issue with a class name being the same as a function name. This is an old way to add a constructor from back in the days. To deal with that issue on line 39 change:

function MCAPI($apikey, $secure=false) {
 $this->secure = $secure;
 $this->apiUrl = parse_url("http://api.mailchimp.com/" . $this->version . "/?output=php");
 $this->api_key = $apikey; }

to

function __construct($apikey, $secure=false) {
 $this->secure = $secure;
 $this->apiUrl = parse_url("http://api.mailchimp.com/" . $this->version . "/?output=php");
 $this->api_key = $apikey; }

As you see we added __construct and with that you initiate a constructor properly.

NB We recommend not using composer for updates anymore. This so your fixes won’t be removed by an outdated flawed version. Just add the plugin to your ignore list.

WP Rocket Algolia Search Conflict

When I ran Algolia Search with WP Rocket I bumped into WP Rocket Algolia Search Conflict. With JavaScript Minification turned on I got several errors

JavaScript Errors

I got this error:

[Error] Failed to load resource: the server responded with a status of 404 (Not Found) (head.js.map, line 0)

as well as these:

Uncaught ReferenceError: algoliasearch is not defined at HTMLDocument.<anonymous> ((index):94) at i (a9b476399a1ace75e81cb940be005dd2.js:2) at Object.fireWith [as resolveWith] (a9b476399a1ace75e81cb940be005dd2.js:2) at Function.ready (a9b476399a1ace75e81cb940be005dd2.js:2) at HTMLDocument.K (a9b476399a1ace75e81cb940be005dd2.js:2) (anonymous) @ (index):94 i @ a9b476399a1ace75e81cb940be005dd2.js:2 fireWith @ a9b476399a1ace75e81cb940be005dd2.js:2 ready @ a9b476399a1ace75e81cb940be005dd2.js:2 K @ a9b476399a1ace75e81cb940be005dd2.js:2

and these:

SyntaxError: expected expression, got '<'
ReferenceError: algoliaAutocomplete is not defined[Learn More] wpvilla.in:131:9

The latter two were the real culprit as a soon as these showed up the site would not load properly anymore. The files causing the issue seemed to be:

https://wpvilla.in/wp-content/plugins/search-by-algolia-instant-relevant-results/js/algoliasearch/algoliasearch.jquery.min.js?ver=2.8.1
https://wpvilla.in/wp-content/plugins/search-by-algolia-instant-relevant-results/js/autocomplete.js/autocomplete.min.js?ver=2.8.1

WP Rocket JavaScript Exclusion

But I could no longer find a way to exclude these to make the error go away. Only CSS files could be excluded with the latest WP Rocket version it seemed:
WP Rocket Minify files
So we have turned off minification of JS for now until we have found a solution to the problem. Either an exclusion somehow or Algolia JS Fix. We will keep you posted!
This until I was reminded by WP Rocket you have to have JavaScript minification turned on to see this box. Then we added the Algolia general script and autocomplete script we found. This however clearly was not enough as we still had the same issues.

Solution

Solution given by WP Rocket for the site not loading with Algolia JS minified in the end was to add this to exclude all Algolia JS:

/wp-content/plugins/search-by-algolia-instant-relevant-results/(.*).js

So that means we probably somehow missed a script besides the ones I mentioned and this one was not excluded. It is now. Happy to have this work though! Again I would prefer to go without the inline script added by Algolia, but to solve that more time would be needed.

Boost Sales with Algolia Search

Let’s face it, WordPress built-in search kind of blows. You can improve search and boost sales with Algolia Search. It will upgrade search to site wide search including products and offers suggestions! And it really easy to get going.

Improving WordPress Search

Visitors as we know can be an impatient bunch. So if we allow them to find what they need faster they are more likely to buy. Also, if search provides suggestions on what is available he or she might also go to a product though he was searching for blog content he saw earlier.

Unfortunately WordPress search out of the box sucks. Even a plugin like Better Search does not quite cut it. Sure it searches not just post, but other post types as well such as pages, but still it does not suggest other possible content, nor is it really fast.

Algolia Search to the rescue

Lighting fast search with search suggestions Google style  can now all be done with the power of Algolia Search. Algolia Search is used heavily in the Laravel community and at Laracasts.com and with good reason.

Algolia Search

It is simply an amazing search integration. This is what is has on offer:

  • site-wide search
  • content suggestions while typing
  • suggests other options when the customer misspells something*

*Here example of misspelling where correct search term is suggested:

Misspelling and suggestions

And while you could integrate Google Search this is way prettier as in really integrates well. Just test it on our site. On typing suggestions popup in a dropdown from where a customer can click on a link. Each suggestion is also displayed with a small thumbnail based on the featured image.

Better Conversion and Lower Bounce Rate

All these features will prove that you can boost sales with Algolia Search. It will suggest possible products to buy and it will show these directly while searching. That is pretty amazing isn’t it. Besides a sales boost it is also just a general retention boost. It will lower your bounce rate as visitors will with ease be able to find follow up content, products and services to look at.

Pricing

Let me just quote what they mentioned on the plugin description page here:

Algolia offers its Search as a Service provider on a incremental payment program, including a free Community Plan which includes 10,000 records & 100,000 indexing operations per month.
Beyond that, plans start at $35/month.

So you can stay on the free community plan post registration – needed for key – as long as you do not pass 10,000 records & 10,000 indexing operations per month. Indexing wise you should not have issues with that anytime soon on most sites and neither should you record wise.

We have had 2,452 records and 3,311 indexing operations so far with with 150+ post and close to 30 pages. Also during the trial the sky’s the limit really.

Setup

First of all you need to install their plugin. That is easy as always.

Search by Algolia – Instant & Relevant results

Next you will need to register to get your

  • application id,
  • search-only api key and
  • admin api key

and get your trial up and running. The plugin will guide you with this.

Algolia Settings

Autocomplete

Then you need to choose the content you would like to be part of the searches and allow Algolia to index it under autocomplete and activate this. This will take some time as in will need to index and store it at Algolia for lightning fast future searches and suggestions.

Algolia Auto Complete

Search Page Choice

On Search page you can choose to use WordPress Search Page or the Algolia Search page:

Search Page and Algolia

This really depends on your preference. We are testing with at the moment.

 

Algolia Dashboard

Once you are setup you can keep track of indexing, searches done and much much more in their Dashboard.

Algolia Dashboard

I like the design and UI in general. It is easy to see what is going on. Do think I won’t be needing to check things here that much, but it is nice to have when search starts getting used a lot.

Rolling your Own

If you want to run it all for free and under your control you can clone the repo and roll your own on your own server. Just to to the repository at Github and get your own copy. Then install in on the same web server or a separate on, and integrate it with your site. Doing this all by yourself will require more technical knowhow and more server power of course, but you do keep all the data under your control

Yoast SEO vs SEO Framework

IMWZ works with both Yoast SEO and the SEO Framework. Both WordPress SEO Plugins are solid. But let’s do a Yoast SEO vs SEO Framework post here and show you what plugin does what best and worst according to us shall we?

Yoast SEO

Yoast SEO or WordPress SEO seems to be the most famous WordPress SEO plugin out there and it has 5+ million active installations. It was the first SEO plugin IMWZ has used and we still use it for multiple client sites as well as this website though we are considering a migration to the SEO Framework for ours.

Readability and Yoast

Yoast SEO checks your content for markers that indicate solid content. This does not mean it will help you patch your crappy writing skills but it will tell you some of the key indicators whether you are on the right track or not.

Yoast SEO Readability

It basically checks for the following:

  • Passive voice – never good to use and better to use the active voice to entice readers
  • Repetition – whether you start sentences the same way too often or not.
  • Flesch Reading Ease – Whether your text is easy to read based on the Flesch Reading Ease formula
  • Paragraph length – whether paragraphs are too long or not – not clear what too long is though really..
  • Sentence Length – whether too many sentences have more than 20 words which worsen the reading of them

Keywords and Yoast SEO

Based on the keyword(s) or longtail keyword you enter Yoast will calculate your SEO.

Yoast SEO Keywords

It will check:

  • keyword density in your content
  • the meta description for keywords,
  • internal linking
  • SEO title lenght
  • outbound links – some to authoritative sites is good
  • minimum 300 words – though we would dispute this
  • duplicate usage of keywords chosen which would not be good
  • images presence – some are recommended

Yoast SEO & Social Media

When you want to setup your display for Facebook or Twitter differently using a different:

  • title
  • body content
  • image

Yoast’s got your back. You can do this using the sharing tab. And with premium you even have previews and Pinterest. Not that we care much about Pinterest down here..

Yoast SEO and Social Media

To be honest we don’t use this tab much and neither do we use changes using the SEO Framework tab. That is because we use other tools for Social Media management such as Buffer.

Advantages of Yoast SEO

Yoast SEO is the ideal SEO plugin for beginners although intermediate and advanced users can benefit from it. Why do we say this? Well because it gives a wonderful presentation of what is OK with your content and not. It also tells you how your keyword(s) are represented in your article. You even get a score for readability and SEO. It feels like you are being guided along to solid content and good seo practices. We really enjoyed that in the beginning as we started out our SEO and WordPress journey.

Disadvantages of Yoast SEO

There were a few things we did notice after a while. A lot of the suggestions are just guidelines and are not always correct. If you follow them to strictly sometimes you butcher beautiful content. Three hundred or more words might work most of the time, but sometimes a short and sweet post will do wonders. Sometimes content is difficult to read… because the topic is hard.

The SEO Framework

The SEO Framework has become more and more our to go to WordPress SEO plugin for reasons we will tell you down the line. Now, how does the SEO Framework work? Well you install it and activate it like any other plugin of course. Duh! Now as soon as this is done the magic starts.

SEO Framework & Automatic Generation SEO Data

The SEO Framework will generate the description and SEO title for you. No need to do that.

SEO Framework Post SEO Settings

It also allows for a custom social image when need be. In general the featured images should do just fine though. For this see the social tab under Post SEO Settings:

Custom Social Image URL

SEO Framework & Post & Page Key SEO Indicators

Also, on the post or page listing it will show you whether the following are correct:

  • title length
  • description length
  • indexed properly
  • page links followed
  • archiving allowed by search engines
  • post is not redirecting

SEO Framework SEO Rating

A nice bird’s eye view of things isn’t it?

Advantages of The SEO Framework

The SEO Framework is a WordPress SEO plugin that warns you from the beginning that it is you who should write solid content and that there is no magical kind of plugin that will do things for you. And at IMWZ we agree. At the end of the day it is all about you writing solid content and preferably content no one ever wrote about before.

It is also amazing that this plugin helps you generate the SEO Title and SEO Description out of the box and let’s you know whether they work or not. That is amazing. And in general when you know your SEO stuff better, do a proper initial paragraph and a solid title / slug that seems to do the trick just fine. Lastly it has a nice listing overview of SEO segments on page listing and post listing as mentioned and the framework is lightweight and easily extensible.

Disadvantages of The SEO Framework

As it does not hold your hand so much you will need a lot of knowledge on good content writing. You also need to know what keyword density will work and not. Just a good SEO title and description is not all there is of course. That is why I would recommend it to more intermediate and advanced users.

So what SEO Plugin to pick?

Well, we go for The SEO Framework. It is lightweight, does not distract you from writing solid content. It just stays in the background and does its thing doing basic automation and warning you on a few core key indicators. It let’s you work on your article, creating great content displayed well in nice chunks with enough imagery and headers to make it easy for people to go through. Something a more experienced writer should have no issues with. Something he or she should enjoy. Idem ditto for SEO writers!

Contact Form 7 CSS Boilerplate

Basic Contact Form 7 CSS styling is horrible. Here a basic setup in CSS I have been working on and will update from time to time. A gist at Github I set up based on one by codehandling. Make sure you do not use the labels and that you check the configuration.

Basic Form Configuration

In Contact Form 7 remove the labels and add placeholders. This will make the form look way more modern and appealing. Here is the basic setup:

[text* your-name placeholder "name"] 

[email* your-email placeholder "email"] 

[textarea your-message class:comment-form] 

[submit "Send"]

As you can see the basic labels have been removed and placeholders have been added for the name and email fields.

Complete Contact Form 7 CSS Boilerplate

So here the actual Contact Form 7 CSS Boilerplate I was talking about. Take it and tweak it to your liking. This setup is responsive and shows a decent form without labels and with placeholders. I have made the fields cover the full width of the form, not just half. I also gave the fields nice rounded corners and a decent submit button.Text in the fields is styled too.

Here is the complete Contact Form 7 CSS Boilerplate:

/***********basic************/

/*Form width*/
.wpcf7 {
    text-align: left;
    width: 90%;
}

/*Input Field widths*/
.wpcf7-text, .wpcf7-textarea {
    width: 100%;
    border: 1px solid #e4e4e4;
    border-radius: 4px;
}

.wpcf7-text {

	height: 50px;
    padding-left: 10px;

}
.wpcf7-text:focus, .wpcf7-textarea:focus {
    border-color: #129FEA;
}

/*Label Font*/
.wpcf7-form p {
    font-size: 16px;
    font-family: 'Roboto', sans-serif;
}

/*Submit button Font*/
.wpcf7-submit {
    width: 85%;
    font-size: 15px !important;
    background: #4a97c2 !important;
    color: #fff !important;
    padding: 20px;
}

/*Submit button Hover*/
.wpcf7-submit:hover {
    background: #3b86b0 !important;
}

/*Response messages - Error & Success*/
.wpcf7-response-output {
    margin-bottom: 30px !important;
}

/***********borders************/

/*Form border*/
.wpcf7 {
    padding: 20px 25px !important;
    padding-bottom: 0px !important;
}

/*Input Field borders*/
.wpcf7-text:focus, .wpcf7-textarea:focus {
    border-color: #8F8F8F !important;
}

/*Submit button Background*/
.wpcf7-submit {
    background: #7E7E7E !important;
    color: #fff !important;
}

/*Submit button Hover*/
.wpcf7-submit:hover {
    background: #5F5F5F !important;
}

/***********colors************/

/*Submit button background & border*/
.wpcf7-submit {
    background-color: #1d2731 !important;
    border: 2px solid #5A5050 !important;
    color: #5A5050 !important;
    font-weight: bold !important;
}

/*Submit button Hover styles*/
.wpcf7-submit:hover {
    background-color: rgba(29, 39, 49, 0.66) !important;    
    border-color: #4CAF50 !important;
    color: #4CAF50 !important;
}

/*Label Text color*/
.wpcf7-form p {
    color: #FFF;
}

.wpcf7-form label{
	/*display: none;*/
}

/*Input Field Text color*/
.wpcf7-text, .wpcf7-textarea {
	color: #777;
}

/****background-images********/

/*Form background*/
.wpcf7 {
    /*background-image: url(http://i.imgur.com/iAFPf0G.jpg);*/
    background-color: rgba(255, 255, 255, 0.2);
    background-position: center;
    background-size: cover;
}

/*Label Text color*/
.wpcf7-form p {
    /*display: none;*/
    /*color: #000000;*/
}

/*Submit button background & border*/
.wpcf7-submit {
    border: 2px solid #FFFFFF !important;
    color: #FFFFFF !important;
}

/*Submit button Hover styles*/
.wpcf7-submit:hover {
    border-color: transparent !important;
    background-color: rgba(0, 0, 0, 0.2) !important;
    color: #FFFFFF !important;
}

/*Input Field border*/
.wpcf7-text:focus, .wpcf7-textarea:focus {
    border-color: #5A3D3D !important;
}

NB Here the  Gist File at Github Gists.

End Result

The end result I will show you now with a screenshot. The theme itself is not quite done yet. Once it is up for sale I will update this post.

Contact Form 7 Styled

 

 

Fork it, adjust it to your liking. If you enjoyed it do leave a comment or link to the blog post. Appreciate it.

Contact Form 7 Mail From Field – How to Set it Properly

Every time I use Contact Form 7 I fall for it. I commit the same error over and over again. I enter the wrong data for the from field on the mail tab. And every time it takes me precious time figuring out this silly error. And it is isn’t correctly told in the documentation either I am afraid. So let’s write it down here so we all remember how to properly configure the Contact Form 7 Mail From Field.

Form Data

Let’s say you create a standard form like so:

<label> Your Name (required)
 [text* your-name size:30 maxlength:60]</label>

<label> Your Email (required)
 [email* your-email]</label>

<label> Your Phone Number
[tel your-tel "012345678"]</label>

<label> Subject
 [text your-subject]</label>

<label>Your Message
 [textarea your-message] </label>

[submit "Send"]

Mail Tab Data

You also add all this data to the mail tab:

to:

jasper@ianua.dev

NB localhost domain

from:

[your-name][your-email]

subject:

iauna "[your-subject]"

additional headers:

Reply-To: [your-email]

message body:

From: [your-name] <[your-email]>
Subject: [your-subject]

Message Body:
[your-message]

--
This e-mail was sent from a contact form on Iauna (//localhost:3000/ianua/site/web)

You check all and see all is well. Well, you think..

Configuration Error Found

Then you save the form and see:

configuration-error-found

What? So you go to Contact Form 7 Documentation to resolve configuration errors and see nothing that is wrong. Zilch! So you check all again. You decide to go to the mail tab and you see:

This email address does not belong to the same domain as the site.

Solution

But…but the your-email tag should load the email address of the client right? It says so here in the documentation that you can. Nope. It is the one connected to the domain. It should be the email address you use to send email to clients. As DavidFB said here:

On the Form, [your-email] is the form fillers address.
On the Mail tab, the settings are for Routing the mail. To is who you want the form data to go to and From is the address SENDing the form data. In this case, it’s not actually the person sending, it’s the web site. So From should match the server domain so it’s not seen by mail servers as spoofing or relaying.

So what you need to add is:

Company Name<name@domain.tld>

After that all will be well. Emails will be sent properly and clients will be happy. Let’s hope we can all avoid this mistake the next time!

Bonus

Do not forget to add the additional headers:

Reply-To: [your-email]

This will make it loads easier to reply to clients when they email you. Saves you time copying their address from the body of the email!

Let us Set things up for you

[product id=”6974″]

Slider Revolution Slide could not be loaded – Possible Fix

Recently I updated my main slideshow on the homepage. I use Slider Revolution. It is awesome and goes well with the theme I use. For most themes I use really. It is a very versatile slider plugin. But this time around I bumped into an issue I did not see until my CDN loaded the new image. A Slider Revolution Slide could not be loaded.

Slider Revolution Slide could not be loaded

Somehow Slider Revolution did not appreciate the new first slide being 974KB. This caused the slider plugin not to load that slide properly. Here the error in the Chrome inspector console I found:

jquery.themepunch.revolution.min.js?ver=5.2.6:8 https://cdn.imagewize.com/wp-content/uploads/2016/10/en-profile-amwaj-imagewize-larger.jpg Could not be loaded !

This error caused a huge white hole on my homepage! I talked to MaxCDN to figure out why the image would not be loaded from their side. They figured it was a JavaScript issue. So not a CDN issue. This as the asset or image could be loaded from their end and from my VPS. And in the end it was. It was not the new live chat which I was testing though. I thought it was because it got added recently.

Slider Revolution Issues

Slider Revolution somehow blocked the loading. I realized this checking the Performance and SEO Optimization tab for that slider.

Performance and SEO Optimization tab

It said there was an issue with my first slide. I decided to optimize it some more with Imagify. The slider plugin somehow still loaded the old slide worth 974KB by itself. That is no longer the case in the screenshot above where the total of the 3 slides is only 379.53 KB. Afterwards it was lighter and loaded well. The warning went away too.

SEO Sidenote

I do know SEO wise many out there are not big fans of sliders. But I do still think when you do offer something on the slides like the initial one does and the titles of services on the others slides can contribute to the whole UX. Also make sure you do not slide right away or not too quickly at least. It annoys repeat visitors. And of course do cache things well so visitors do not have to wait too long.

Furthermore, do remember, the eye wants something too and that it provides. I do see a trend popping up every now and then where sites are told to be stripped to the bare minimum and drop slideshows and large images. People are not bots people!

Slider Revolution still a keeper

Finally, the enormous options Slider Revolution offers are incredible. They way you can display slides, effects you can choose and control over desktop, tablet and mobile you have are simply terrific. Too bad the issue was not clear for me from the start. And, perhaps, Slider Revolution should tell me clearer when an added image causes issues.. Still, happy user of SR and not going away anytime soon.

Anyways, that is that. I hope this helps others!

Need help setting things up?

[product id=”7324″]

Envato Market Plugin

Found out about something really cool this morning. There is a plugin that allows you to update your Envato / Themeforest themes and plugins using a WordPress plugin called Envato market.

Downloading Envato Market Plugin

It is available at Github and can be downloaded here (will start downloading zip file right away). It is a neat plugin that will work right out of the box. Just upload it as a plugin you want to add that is not part of the repository as usual and activate it. There is nothing to it.

Envato Market Backend View

Once you have uploaded and activated the plugin you can choose Envato Market from the sidebar menu in the Dashboard. Then you will be asked to generate an Oauth token.

Global OAuth Personal Token

OAuth Token Generation

This token will allow the plugin access to your Envato account to do certain things like download and update your plugin. All the needed options will be selected right away.

envato market token options

You only need to agree with their terms. This is at the bottom on the page where you can check what access you will allow as shown above. As said just keep the defaults and agree. Then you will see this:

Envator Market Plugin Key

You do need to confirm again that you copied the key. Then you click on “Woohoo got it!” . After that you will be sent back to your Envato apps.

Managing your Envato App

This here below is the display of your Envato Apps management page. It is where you see with what tokens for what apps you are working with.

Envato - My Apps

As you can see the App page is a bit behind as we just created a token for an app (the plugin) to access, but the changes will show up at a later stage. If you have been using Envato apps for a while you will see a list display here.

Running  Updates

Once the key has been confirmed as generated by you you can choose the item to update from the Envato Market plugin page in your Dashboard. Et voila. In no time the plugin will have been updated. Just did this for Rocket Pure‘s HumbleShop theme and it worked like a charm!

Here is how the page looks in the Dashboard with the just updated theme:

Envato Market in Dashboard

BackupBuddy Wordfence Conflict

Had a BackupBuddy Wordfence conflict the other day. I noticed in the BackupBuddy logs that BackupBuddy failed to make a backup as it tried to backup the Wordfence tmp file while that was being used by Wordfence. And therefore it failed.

Calling BackupBuddy..

I contacted BackBuddy support. They responded quite quickly as they always do. Love that and love BackupBuddy for making complete backups and taking care of migrations. Just like I love Wordfence for taking care of my sites’ security.

Site to Site Solution

To deal with this you need to excluded the directory for all file and complete backups:

/wp-content/plugins/wordfence/tmp/

in BackupBuddy under general settings > Default excluded files & directories (relative to WordPress root):

BackupBuddy File and Directory Defaults

 

That way that directory will always be ignored / excluded. Did use directory exclusion on BackupBuddy before the exclude certain error logs, backup directories. I also excluded some tables like Slimstat tables as they can get really big if you intend on keeping data for a year or more.

Database Defaults Settings BackupBuddy:

BackupBuddy Database Defaults

This was the first time I bumped into a specific BackupBuddy Wordfence conflict though.

TMP in Plugin Directory?

In my correspondence with BackupBuddy they stated that:

Plugins really should not create temporary directories/data under their own plugin installation directory but Wordfence tends to play by its own rules 🙂

Whether a plugin author should place a tmp folder in the plugin directory or in the webroot is a discussion I would love to have. I think it is OK to have it in the plugin root. I love to keep the webroot clean and avoid conflicts with other plugins. Would love to hear what other people think about this.

Permanent Solution

You would think that BackupBuddy – commercial WordPress plugin for backups – would make sure it would work well with the most populair Freemium Security plugin out there. Even though iThemes have their own commercial Security plugin they should still play nice with others out there, shouldn’t they? Especially if the other party is populair and has a free version.

But that is my opinion. I will not leave either plugin any time soon. Would however love to have this conflict out of the way and not being forced to add this exclusion to every WordPress site I work on.

What do you think?

If you have an opinion on the location of the tmp directory for plugins or have questions on the blog post do let me know. Would love to hear about it all!

 

Update Feedback BackupBuddy

Quite happy to discuss tmp file locations, but under a plugin installation directory is not a location to use as you cannot rely on write access. Here is the code from WF related to this:

private static function getCacheFile(){
    return WORDFENCE_PATH . 'tmp/configCache.php';
}

and this simply will not yield a usable file if there is no write access. WordPress provides a specific function to yield a (base) temporary directory location which also allows the user to set their own temporary directory and a plugin might then create their own subdirectory for their own use – this allows the user to control where theywant temporary files to go and makes it simpler for all such temporary data to be excluded from a backup by simply excluding that directory. Of course a user can define this to be outside the installation directory provided PHP has access to it (it doesn’t need to be externally accessible).

Would be nice though if BB would play nice with Wordfence – very populair security plugin – without using this directory
exclusion solution.

Yes, it certainly would be good if the Wordfence developers gave a little more thought to their design decisions and the impact they are going to have on their users. WordPress is a largely “uncontrolled” ecosystem and it relies upon developers thinking in a wider context than just their product and sadly with Wordfence this is not an isolated case.

WordFence’s Take

I have had no feedback from WordFence yet. Must say that I do feel that BackupBuddy seems to be having a point here..

  1.  BackupBuddy is an awesome WordPress backup plugin
  2. Wordfence is the best freemium security WordPress plugin out there