Category: WordPress

WordPress Shortcodes allow you to extend the functionality of WordPress. Shortcodes are text within the square bracket. You can paste this shortcode on any page, post or widget. WordPress executes the PHP function associated with the shortcode and displays the result instead of the actual shortcode text. You can find more about WordPress shortcodes at

https://codex.wordpress.org/Shortcode_API

To create a shortcode, open functions.php in your theme folder, add the following code at the end of the file

//[helloworld]
function helloWorld_func( $atts ){
   return "Hello World from shortcode";
}
add_shortcode( 'helloworld', 'helloWorld_func' );

Now your shortcode is ready. You can place the shortcode on any page, post, or widget by placing the following text

[helloworld]

It will display the text Hello World from shortcode.

A shortcode is a normal PHP function, it can do more complex things like connect to MySQL database, fetch data from a remote API, do calculations, etc…

See WordPress

Here are list of popular Free WordPress themes.

Kadence

Kadence is a multipurpose WordPress theme that is available for free download and also offers a pro version that opens up more possibilities.
Themes offers lots of modification options and customization possibilities to explore your creative and create something amazing.

Best Features

Header and footer builder
Sticky and transparent header
Global color palette
Extremely intuitive design
Beautiful SVG social icons (no plugin needed)
Related posts built-in
Scroll to top
Tight integration with Gutenberg and Kadence Blocks

Download Demo Homepage

OceanWP

OceanWP is a one of the most popular free WP Theme. OceanWP will enable you to create almost any type of website such a blog, portfolio, business website.

OceanWP is a modern WordPress design — it’s responsive, and can support multiple languages. It is a fast-loading WordPress theme that has great support for third-party plugins and drag-and-drop page builders.

There are more than 20 plugin extensions available for OceanWP, and these can be used to add more styling options, additional widgets for page builders, new custom post types and more.

Key Features of OceanWP

Multipurpose and flexible looks
Uses the native WordPress Customizer for customization
Pre-built importable demo sites
Offers a number of free extensions
Lots of different header image options
Built to work well with popular WordPress page builders
WooCommerce compatible for small businesses with online shops
Active on 300,000+ sites
5-star rating on over 2,100 reviews at WordPress.org

Download Demo Homepage

GeneratePress

This is another WordPress theme that’s similar in principle to Astra and OceanWP. Once again, you get an extended customisation interface with a lot of dials and knobs.

The great news about GeneratePress is that any beginner could install the theme and start blogging within minutes. As for more advanced developers, it’s a fast, lightweight, and highly customizable free WordPress theme.

Key Features

Multipurpose
Very lightweight with excellent performance
Compatible with the Gutenberg block editor
Excellent code quality
Integrates well with all major page builders, including Elementor and Beaver Builder
WooCommerce compatibility

Download Demo Homepage

Neve

Neve is a fast, lightweight theme with easy setup and sleek designs. With speed as a top priority, this theme loads in less than one second to keep your bounce rate low. In minutes, you can create a professional website with custom headers and footers

Key Features

Responsive design
Built to work well with the new WordPress block editor
One-page design
Customization options in the real-time WordPress Customizer
Mega menu support
Importable demo sites
WooCommerce compatible for online shops

Download Demo Homepage

Astra

Astra is a powerful and fast growing free WordPress theme.The unique thing about this theme is that it comes as a free version that already gives you a basic set of options, as soon as you want to take it one step further you can upgrade and get access to a huge design library.

Key Features

Multi-purpose, fit for any type of a website
Lots of customization options in the native WordPress Customizer
Built with page builders in mind
Lightweight, responsive layouts for mobile devices
Works great with drag-and-drop page builders like Elementor
One of the most popular free WordPress themes, with more than 200,000 active installations
Compatible with the Gutenberg block editor
SEO friendly, translation and RTL ready
User-friendly theme with intuitive dashboard options
Custom widgets and widget areas, 700+ Google fonts, social icons, custom backgrounds, and numerous color options
WooCommerce support for business websites with e-commerce stores

Download Demo Homepage

Hestia

Hestia is a stylish and modern one-page theme that’s flexible for any type of website. It has a focus on speed and performance so your website will load quickly.

Featuring a live customizer and a wide range of theme options you will enjoy working with this WordPress theme.

It fits creative business, small businesses startups, corporate businesses, online agencies and firms, portfolios, ecommerce (WooCommerce), and freelancers.

Key Features
Gutenberg-ready and easily customizable
WooCommerce support
Includes video tutorials for additional guidance
Translation ready

Download Demo Homepage

Zakra

Zakra is one of the best free WordPress themes available built with optimal performance and fast speed in mind. Combining impactful visuals alongside a feature-rich dashboard, this theme is sure to leave your visitors impressed.

The Zakra theme is optimized for SEO, which will help you rank better in the search engines, loads fast, and includes demo content so that you can speed up the design and setup process.

Key Features
primary color option,
GDPR compliant,
responsive design,
seven widget areas,
Block editor and Elementor support,
ten different demos,
lightweight and fast.

Download Demo Homepage

Spacious

Spacious is a minimalist multipurpose WordPress theme, with a clean and friendly look.You can use it for your business, portfolio, blogging or any type of site.The theme uses colorful icons and buttons, a boxed layout, a beautiful featured slider, and an efficiently arranged content, so it can occupy less space.

Key Features
4 slides in the slider
Two page templates
Four blog display types
13 widgets areas
Five custom widgets focusing on business template
Primary color option to match your logo and website
Translation ready and many more.
WooCommerce support

Download Demo Homepage

ColorMag

The theme has an elegant and beautiful look, with colorful buttons, featured slider, and an intuitive content structure.
It includes tons of easy to customize features including primary color options, typography options, custom widgets, and custom widget areas.

Key Features
primary color
boxed and wide layout option
WooCommerce compatibility
15+ widget areas and 5+ custom widgets
6 social icons

Download Demo Homepage

Airi

Airi is a powerful and lightweight theme for your business website. It’s perfect for both companies and freelancers. What’s more, the theme also supports WooCommerce and works well with Elementor.The nice thing about Airi is that it comes with a fresh, appealing interface – your site will surely look great if you use it.

Key Features

A full-width header image option
Works with the Elementor page builder
WooCommerce integration
translation ready
Access to Google Fonts
Live Customizer

Download Demo Homepage

Content Devlivery Network (CDN) allow your web site to serve images from another domain or a sub domain. This speed up web site as your web server don’t need to serve images. Also browsers have a limit on number of parallel downloads from same domain. Having images on a differnt domain bypass this limitation of web browser.

If you use a pull type CDN or a CDN that you manually upload using some sync tool, you need to rewrite all image url to CDN url. There are several plugins available to do this. But you can easily do this with out any plugins.

Edit file

wp-content/themes/YOUR-THEME/functions.php

Add following code to end of the file.

add_filter('wp_get_attachment_image_src', 'staticize_attachment_src', null, 4);

function staticize_attachment_src($image, $attachment_id, $size, $icon) {
    if (is_array($image) && !empty($image[0])) {
        $image[0] = str_replace( 'https://www.YOUR-DOMAIN-HERE/wp-content/uploads/', 'https://cdn.YOUR-DOMAIN-HERE/wp-content/uploads/', $image[0] );
    }
    return $image;
}

This will replace image urls with CDN url.

I have migrated a web site using Avada WordPress theme.

Once site is migrated, i edited wp-config.php file and added following to avoid site getting redirected to old website url.

define('WP_HOME','https://www.newurl.com');
define('WP_SITEURL','https://www.newurl.com');

Now site works, but some of the resources are loaded from OLD site url, this breaks some of the icons.

On Browser Developer tool console, it show following errors

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://www.oldurl.com/wp-content/themes/Avada/includes/lib/assets/fonts/icomoon/icomoon.woff. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://www.oldurl.com/wp-content/themes/Avada/includes/lib/assets/fonts/fontawesome/webfonts/fa-regular-400.woff2. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://www.oldurl.com/wp-content/themes/Avada/includes/lib/assets/fonts/fontawesome/webfonts/fa-solid-900.woff2. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://www.oldurl.com/wp-content/themes/Avada/includes/lib/assets/fonts/icomoon/icomoon.ttf. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://www.oldurl.com/wp-content/themes/Avada/includes/lib/assets/fonts/fontawesome/webfonts/fa-regular-400.woff. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://www.oldurl.com/wp-content/themes/Avada/includes/lib/assets/fonts/fontawesome/fa-solid-900.woff. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://www.oldurl.com/wp-content/themes/Avada/includes/lib/assets/fonts/fontawesome/webfonts/fa-regular-400.ttf. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).

Using URL replacement plugins like Better Search Replace or Velvet Blues Update URLs did not fix the problem.

To fix the it, login to wp-admin. Click on “Avada” on left menu, select Theme Options

wp-admin > Avada > Theme Options > Import/Export

Under Export Options, click on “Download Data File”, this will ask you to save theme configuration file as a .json file, for me it saved fusion_options_backup_02-08-2019.json.

Next click on “Import Contents from File” button. It will show a text area, paste content of the json file you downloaded in previous step here and click “Import”. This will fix the problem related to fonts loading from old url.

If you have a wordpress web site that give blank screen, you can add following to wp-config.php to enable displaying errors.

define( 'WP_DEBUG', true );
define( 'WP_DEBUG_LOG', true );
define( 'WP_DEBUG_DISPLAY', true );
@ini_set( 'display_errors', 1 );
define( 'SCRIPT_DEBUG', true );

This should be added above line

/* That's all, stop editing! Happy blogging. */^M

https://wordpress.org/plugins/query-monitor/
https://wordpress.org/plugins/debug-bar/

Migrate Guru: Migrate & Clone WordPress Free

This plugin allow you to transfer your wordpress web site to another hosting for free. It support sites upto 200 GB in size. Use BlogVault to do the transfer.

https://wordpress.org/plugins/migrate-guru/

All-in-One WP Migration

This free plugin allow you to backup and restore your wordpress site. Free version support sites upto 500 MB. If your site is larger, you need to use paid version of this plugin.

To remove 500 MB limit, edit file

vi constants.php

Find

define( 'AI1WM_MAX_FILE_SIZE', 2 << 28 );

Replace with

define( 'AI1WM_MAX_FILE_SIZE', 8000 * 1024 * 1024 ); // Allow 8000 MB file restore.

https://wordpress.org/plugins/all-in-one-wp-migration/

On a WordPress site using CherryFramework based theme, was getting following error.

lessphp fatal error: load error: failed to find /home/mediaxtreme/sitedomain.com/wp-content/themes/theme50607/bootstrap/less/bootstrap.lesslessphp fatal error: load error: failed to find /home/mediaxtreme/sitedomain.com/wp-content/themes/theme50607/style.less
Warning: Cannot modify header information - headers already sent by (output started at /home/mediaxtre/public_html/wp-content/themes/CherryFramework/includes/less-compile.php:157) in /home/mediaxtre/public_html/wp-login.php on line 423

This was due the web site have migrated to a new server and the path in new server was differnt than old server.

To fix, edited file

wp-content/themes/CherryFramework/includes/less-compile.php

On line 157, you see following code

        try {
                $less->compileFile($inputFile, $outputFile);
        } catch (Exception $ex) {
                echo "lessphp fatal error: ".$ex->getMessage();
        }

Replace ith with

        try {
                $less->compileFile($inputFile, $outputFile);
        } catch (Exception $ex) {
                # echo "lessphp fatal error: ".$ex->getMessage();
        }

You will be able to login to wordpress admin area. Once you logged in, go to theme settings and just update, this will update the paths. Now you can remove the change you done in less-compile.php