Tag: WordPress

  • How to create a WordPress shortcode?

    How to create a WordPress shortcode?

    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

  • Best WordPress themes in 2021

    Best WordPress themes in 2021

    Here are list of popular Free WordPress themes.

    Kadence

    best wordpress theme

    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

    wordpress theme 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

  • How to Enable WordPress Toolkit in Cpanel/WHM

    How to Enable WordPress Toolkit in Cpanel/WHM

    WordPress Toolkit in Cpanel/WHM allows you to easily install and manage WordPress websites.

    To install WordPress Toolkit, log in to WHM as user root.

    Go to

    WHM > WHM Marketplace
    

    WordPress Toolkit WHMCS

    On the Next page, you have the option to install WordPress Toolkit.

    Install wordpress toolkit on cpanel server

    Methood 2: Usuing command line

    To install WordPress Toolkit in Cpanel server, login to SSH as user root, then run the following command.

    curl https://wp-toolkit.plesk.com/cPanel/installer.sh | sh
    

    After installation, you will be able to see WordPress Toolkit in CPanel.

    WordPress Toolkit CPanel

    You can enable/disable WordPress toolkit under Feature Manager in WHM.

    WHM > Packages > Feature Manager
    

    WordPress Toolkit WHM Feature Manager

    How to install WordPress using WordPress Toolkit

    This video will show how to install WordPress using WordPress Toolkit in Cpanel Server.

    Uninstall WordPress Toolkit

    If you want to remove WordPress Toolkit, run

    rpm -e wp-toolkit-cpanel
    

    See Cpanel Server, WordPress

  • Stop xmlrpc.php attack on Cpanel Server

    xmlrpc.php is part of wordpress. It is used for some API. This is used by hackers to bruteforce WordPress installations, that can cause high server load and slow server performance.

    On cpanel server, to prevent xmlrpc.php attack go to

    WHM > Service Configuration > Apache Configuration > Include Editor

    click on “Pre Main Include”, then select your apache version.

    On text box below, paste

    
      RedirectMatch 301 /xmlrpc.php http://127.0.0.1/
    
    

    Click Update.

    Prevent xmlrpc.php attack on Cpanel Server

    All request to xmprpc.php will be blocked.

  • EasyEngine backup WordPress Database

    EasyEngine backup WordPress Database

    EasyEngine run database of web sites in a Docker container. To take backup of MySQL database used by a WordPress website, you can run command

    ee shell DOMAIN_NAME --command='wp db export'
    

    This will create database backup on document root of the web site.

    EasyEngine WordPress Database Backup

    Backup will be available in your web sites document root

    /opt/easyengine/sites/YOUR_DOMAIN.EXTN/app/htdocs/
    

    You can also download using

    http://YOUR_DOMAIN.EXTN/backup-file-name.sql
    

    See EasyEngine

  • WordPress use CDN with out plugin

    WordPress use CDN with out plugin

    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.

  • WordPress Avada theme load fontawesome from old site

    WordPress Avada theme load fontawesome from old site

    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.

    WordPress Avada theme icon missing

    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.

  • WordPress CLI

    To install WordPress CLI, run the following command

    curl -O https://raw.githubusercontent.com/wp-cli/builds/gh-pages/phar/wp-cli.phar
    mv wp-cli.phar /usr/local/bin/wp
    chmod 755 /usr/local/bin/wp

    How to reset WordPress Password using wp-cli

    To list all users in WordPress, run

    wp user list

    To create an Administrator user, run

    wp user create  USERNAME_HERE  [email protected] --role=administrator --user_pass=PASSWORD_HERE
  • WordPress debug

    WordPress debug

    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/

  • Ubuntu Apache Setup for WordPress

    Ubuntu Apache Setup for WordPress

    On a Fresh Ubuntu 18.04 server, run following commands to setup Apache, PHP and MySQL needed for WordPress installation.

    You can go to each file and manually run the commands if you want to see what commands are executed.

    wget https://raw.githubusercontent.com/serverok/server-setup/master/ubuntu/1-basic-tools.sh
    wget https://raw.githubusercontent.com/serverok/server-setup/master/ubuntu/2-apache-php-mysql.sh
    wget https://raw.githubusercontent.com/serverok/server-setup/master/install/update-php-ini.sh
    bash ./1-basic-tools.sh
    bash ./2-apache-php-mysql.sh
    bash ./update-php-ini.sh
    

    At this stage, you have LAMP server setup and ready to go.

    To get your domain work with Apache, first you need to point your domain to server IP. This can be done by editing DNS records with your domain registrar or DNS provider.

    In commands below, replace

    DOMAIN.COM = replace with your actual domain name
    USERNAME = you can use any username you wnat, first 8 chars of domain name for example

    Create SFTP User

    useradd -m --shell /bin/bash --home /home/DOMAIN.COM USERNAME
    usermod -aG sudo USERNAME
    

    Set a password for the user. This will be used to login to SFTP

    passwd USERNAME
    

    You will be asked to enter password 2 times.

    Configure Apache

    First lets make Apache run as the user, this will make WordPress upgrade easier.

    sed -i "s/www-data/USERNAME/g" /etc/apache2/envvars
    chown -R USERNAME:USERNAME /var/lib/php/
    

    Create Apache VirtualHost entry

    vi /etc/apache2/sites-available/DOMAIN.COM.conf
    

    Add

    
        ServerName DOMAIN.COM
        ServerAlias www.DOMAIN.COM
        ServerAdmin [email protected]
        DocumentRoot /home/DOMAIN.COM/html
        
            Options All
            AllowOverride All
            Require all granted
            Order allow,deny
            allow from all
        
    
    

    To activate the web site, run

    a2ensite DOMAIN.COM
    

    Create document root and set permission

    mkdir -p /home/DOMAIN.COM/html
    chown -R USERNAME:USERNAME /home/DOMAIN.COM/
    chmod -R 755 /home/DOMAIN.COM/html/
    

    Restart Apache

    systemctl restart apache2
    

    Create MySQL Database

    Login to mysql, on ubuntu, as user root, run

    mysql
    

    Now you will be in MySQL command promt, run following 2 commands to create a Database and User.

    create database DB_NAME;
    grant all on DB_NAME.* to 'DB_USER'@'localhost' identified by 'MYSQL_PASSWORD';
    

    Replace MYSQL_PASSWORD with your own MySQL password. DB_NAME with name of database you need. DB_USER with username for the db.

    You will need these when installing WordPress.

    Installing LetsEncrypt

    First install letsEncrypt with

    wget https://raw.githubusercontent.com/serverok/server-setup/master/install/letsencrypt.sh
    bash ./letsencrypt.sh
    

    To get SSL for your domain, run

    certbot --authenticator webroot --webroot-path /home/DOMAIN.COM/html/ --installer apache --email [email protected] -d DOMAIN.COM -d www.DOMAIN.COM
    

    Replace [email protected] with your actual email address.

    Installing WordPress

    You can now SFTP/SSH into the server. Upload WordPress into html folder. Make sure you use the newly created USER to do this, if you do it as user root, you will get permission error. Visit the web site, you wil get WordPress install wizzard. Just fill the form to do the install. You will need to enter MySQL login details you created before.

    Install WordPress using SSH

    First login with SSH user you created with command

    ssh USER@SERVER_IP_ADDR
    

    You will be asked to enter password. Enter password you created before.

    Download wordpress

    wget https://wordpress.org/latest.tar.gz
    

    Extract wordpress files with

    tar xvf latest.tar.gz
    

    This will create a folder “wordpress” with the files.

    To make the site live, we need to replace folder html with this new wordpress folder

    mv html html-old
    mv wordpress html
    

    Now you can go to the site, you will see wordpress install screen.

    See WordPress

  • Install WordPress in Kubernetes

    To install WordPress in Kubernetes, you need to install helm package manager.

    Now run

    helm install stable/wordpress
    

    After the helm chart is run, you will get commands to get login for WordPress admin area.

    Here is services it create

    boby@sok-01:~$ kubectl get service
    NAME                             TYPE           CLUSTER-IP      EXTERNAL-IP    PORT(S)                      AGE
    kubernetes                       ClusterIP      10.39.240.1              443/TCP                      34m
    whopping-labradoodle-mariadb     ClusterIP      10.39.248.140            3306/TCP                     2m
    whopping-labradoodle-wordpress   LoadBalancer   10.39.253.160   35.193.33.14   80:32054/TCP,443:30939/TCP   2m
    boby@sok-01:~$
    

    List of all pods

    boby@sok-01:~$ kubectl get pod
    NAME                                             READY   STATUS      RESTARTS   AGE
    ubuntu                                           0/1     Completed   0          21m
    whopping-labradoodle-mariadb-0                   1/1     Running     0          3m
    whopping-labradoodle-wordpress-8bddb5fdf-2l24d   1/1     Running     0          3m
    boby@sok-01:~$ 
    

    Deployments

    boby@sok-01:~$ kubectl get deployment
    NAME                             DESIRED   CURRENT   UP-TO-DATE   AVAILABLE   AGE
    whopping-labradoodle-wordpress   1         1         1            1           4m
    boby@sok-01:~$ 
    

    To scale the deployment, run

    boby@sok-01:~$ kubectl scale deployment/whopping-labradoodle-wordpress --replicas=2
    deployment.extensions/whopping-labradoodle-wordpress scaled
    boby@sok-01:~$ 
    

    See Helm Kubernetes Package Manager, Kubernetes

  • WordPress Backup and Migration Plugins

    WordPress Backup and Migration Plugins

    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/