WordPress Themes, Plugins & Tutorials https://1stwebdesigner.com/category/wp/ Helping You Build a Better Web Fri, 30 Jun 2023 15:25:30 +0000 en-US hourly 1 https://1stwebdesigner.com/wp-content/uploads/2020/01/1stwebdesigner-logo-2020-125x125.png WordPress Themes, Plugins & Tutorials https://1stwebdesigner.com/category/wp/ 32 32 How to Limit Post Revisions in WordPress https://1stwebdesigner.com/limit-post-revisions-wordpress/ Fri, 30 Jun 2023 15:25:30 +0000 https://1stwebdesigner.com/?p=159029 Optimizing your WordPress workflow often involves tweaking a few settings and functions. One of these features is post revisions. This built-in functionality can be a lifesaver, especially when you want to revert changes or restore an earlier version of a …

]]>
Optimizing your WordPress workflow often involves tweaking a few settings and functions. One of these features is post revisions. This built-in functionality can be a lifesaver, especially when you want to revert changes or restore an earlier version of a post. However, having an excessive number of revisions can be overwhelming and may clutter your database.

We’ll guide you through the steps to limit post revisions in WordPress, without turning to specific plugins.

Kinsta

Understanding WordPress Post Revisions

Post revisions, a core feature of WordPress, allows you to undo changes and revert to previous versions of your posts or pages. For every draft in progress, WordPress automatically generates a temporary revision (known as an auto-save) every 60 seconds. It supersedes older versions with these new auto-saves.

Alongside auto-saves, WordPress creates permanent revisions each time a user hits save, update, or publish. These permanent revisions are stored in the WordPress database and can be managed from the post-edit screen.

Why Would You Limit Post Revisions?

Limiting post revisions does not necessarily mean you’re capping your site’s performance. WordPress intelligently excludes post revisions from the database calls on the front end, only including them on the post-edit screen or while browsing revisions.

However, having a large number of post revisions can cause your WordPress database to become bulky, and although it won’t affect your site’s performance, it may make you feel a bit disorganized. Keeping your database clean and neat is good practice and can make your backend operations smoother.

The Manual Approach

Now, let’s jump into how you can limit post revisions manually in WordPress without the use of plugins.

Restricting the Number of WordPress Post Revisions

WordPress enables you to control the number of revisions retained for an article. To set a limit, you’ll need to add a specific line of code to your WordPress site’s wp-config.php file.

define( 'WP_POST_REVISIONS', 7 );

In the above code snippet, replace “7” with the desired number of revisions you wish to store for each post. Remember to save and close the file after making your adjustments.

How to Completely Turn Off WordPress Post Revisions

If your objective is to entirely disable post revisions, WordPress allows for this as well. By incorporating the following line of code into your wp-config.php file, you can turn off the post revision functionality:

define('WP_POST_REVISIONS', false );

Specifically, this command will deactivate the post revisions feature on your website. However, it’s crucial to understand that WordPress will continue to preserve one auto-save and one browser-stored revision despite this change.

Wrapping Up

Fine-tuning how post revisions are handled in WordPress can lead to a tidier database and a more streamlined content production process. It’s worth noting that manipulating core files requires a basic level of comfort with code or additional guidance. For related WordPress management topics, feel free to check out our guide on managing widgets in your WordPress dashboard.

]]>
WordPress Dashboard: Removing Unwanted Widgets https://1stwebdesigner.com/wordpress-dashboard-remove-widgets/ Thu, 29 Jun 2023 17:17:38 +0000 https://1stwebdesigner.com/?p=159008 Your website’s command center, the WordPress dashboard, arrives with several widgets that enhance functionality. However, not all of these may be beneficial for every user. As plugins introduce more widgets over time, your dashboard may start to feel crowded and …

]]>
Your website’s command center, the WordPress dashboard, arrives with several widgets that enhance functionality. However, not all of these may be beneficial for every user. As plugins introduce more widgets over time, your dashboard may start to feel crowded and less straightforward to navigate. WordPress offers the ability to remove these unnecessary widgets, either manually or programmatically. We’ll guide you through both of these methods, aiding in decluttering your dashboard and promoting better website management.

Kinsta

Understanding Widgets

Widgets are elements you can include in your WordPress site’s sidebars or other widget-ready areas. WordPress includes default widgets, and plugins may introduce more. All these widgets can be managed through the Appearance » Widgets screen in your WordPress dashboard. However, an excess of unused widgets can lead to a messy widget screen. To make your dashboard more navigable, consider disabling those you don’t need. For an in-depth look at managing widgets, you can explore the WordPress official documentation.

Manual Widget Removal from WordPress Dashboard

For the quick and temporary cleanup of your dashboard, WordPress allows you to hide widgets that you don’t frequently use. Follow these steps to hide widgets:

  1. Log into your WordPress Dashboard.
  2. Locate the “Screen Options” button at the top right corner of the screen and click on it.
  3. Uncheck the boxes beside the widgets you want to hide.

While this method doesn’t eliminate the widgets entirely, it does make them invisible from your view. Other users can still enable these widgets from the Screen Options panel.

Programmatic Widget Removal from WordPress Dashboard

For a more lasting cleanup, WordPress provides a way to get rid of dashboard widgets completely, preventing other users from turning them back on. This involves adding a code snippet to your theme’s functions.php file or to the site-specific plugin you’re using. Here’s the code snippet:

function clear_dashboard_widgets() {
global $wp_meta_boxes;

unset($wp_meta_boxes['dashboard']['side']['core']['dashboard_quick_press']);
unset($wp_meta_boxes['dashboard']['normal']['core']['dashboard_incoming_links']);
unset($wp_meta_boxes['dashboard']['normal']['core']['dashboard_right_now']);
unset($wp_meta_boxes['dashboard']['normal']['core']['dashboard_plugins']);
unset($wp_meta_boxes['dashboard']['normal']['core']['dashboard_recent_drafts']);
unset($wp_meta_boxes['dashboard']['normal']['core']['dashboard_recent_comments']);
unset($wp_meta_boxes['dashboard']['side']['core']['dashboard_primary']);
unset($wp_meta_boxes['dashboard']['side']['core']['dashboard_secondary']);
}

add_action('wp_dashboard_setup', 'clear_dashboard_widgets' );
}

The function above targets and removes the widgets listed. If there are certain widgets you wish to retain, simply remove the corresponding line from the code.

To customize this further, you can add the following function to the functions.php file to restrict the dashboard widget removal to only non-admin users:

if (!current_user_can('manage_options')) {
add_action('wp_dashboard_setup', 'clear_dashboard_widgets' );
}

Concluding Remarks

Having a neat and organized dashboard is a significant step towards more efficient WordPress management. Discarding unnecessary widgets tailors your dashboard to your exact needs, fostering a more effective and enjoyable user experience.

Aside from decluttering your dashboard, there are other optimization steps you can take to bolster your website’s performance and security. For instance, hiding your WordPress version can contribute to creating a more secure WordPress environment.

We hope these tweaks will help you maintain a clean and efficient dashboard, helping you focus on what truly matters: creating outstanding content.

]]>
Hide Your WordPress Version for Better Security https://1stwebdesigner.com/prevent-wordpress-version-display/ Wed, 28 Jun 2023 14:01:06 +0000 https://1stwebdesigner.com/?p=158981 WordPress is generally a secure platform, but there are ways to make it even more robust. Hiding the version of your WordPress instance is one such way to beef up security. While this might seem a bit technical, we’ll guide …

]]>
WordPress is generally a secure platform, but there are ways to make it even more robust. Hiding the version of your WordPress instance is one such way to beef up security. While this might seem a bit technical, we’ll guide you through the process step by step.

Kinsta

Why Hide the WordPress Version?

By default, WordPress discloses its version information on your site. While it’s a helpful detail for developers, it may provide potential hackers with a road map to your site’s vulnerabilities. If they’re aware of the version you’re running, they can tailor their attacks accordingly. Hence, obscuring this information can be an essential part of your security strategy.

Incomplete Solutions and Their Limitations

You might find suggestions to edit your theme’s header.php file to eliminate the version number:

<meta name="generator" content="WordPress <?php bloginfo('version'); ?>" />

However, each time you update your theme, this change will be overridden, and the version number will reappear. Consequently, it’s a fleeting solution at best.

Another commonly recommended approach is to inject this code into your theme’s functions.php file or a specific plugin:

remove_action('wp_head', 'wp_generator');

While this will mask the version number in the site’s header, it won’t do so in your RSS feeds, making this solution incomplete.

A Better Solution: Hiding the Version with Code

For a more holistic approach, you’ll want to hide the WordPress version from both your header and RSS feeds. To achieve this, you can use this function:

function remove_wp_version() {
   return '';
}
add_filter('the_generator', 'remove_wp_version');

You can add this code to your theme’s functions.php file. It effectively ceases the broadcasting of the WordPress version, making it much more challenging for hackers to tailor their attacks.

Beyond Hiding the Version: Other Security Measures

Hiding your WordPress version represents only one facet of your site’s security. Other key steps include regularly updating your WordPress site and utilizing strong, unique passwords.

For more concrete security practices, consider restricting user access according to roles, implementing two-factor authentication, using secure FTP to transfer files, and making sure to use trusted themes and plugins.

Remember, maintaining website security isn’t a set-and-forget task. It’s crucial to stay current with the latest threats and to adjust your protective measures as needed.

Moreover, while focusing on security, don’t neglect website performance. An action as simple as disabling the emoji autoload function can significantly boost site speed.

Wrapping Up

Ensuring your website’s security is a continual task. As your site grows, so does the potential pool of threats. Each step you take – whether it’s regularly updating WordPress, hiding its version number, or implementing other security practices – contributes to a more secure environment.

]]>
Disabe Emoji Autoload for Faster WordPress Sites https://1stwebdesigner.com/disabling-emoji-autoload-wordpress/ Tue, 27 Jun 2023 15:45:02 +0000 https://1stwebdesigner.com/?p=158959 Website speed is critical to the success of any online venture, which is why we’ll discuss how to disable Emoji Autoload in WordPress in this guide. Not only does site speed have a direct impact on user engagement and conversion …

]]>
Website speed is critical to the success of any online venture, which is why we’ll discuss how to disable Emoji Autoload in WordPress in this guide. Not only does site speed have a direct impact on user engagement and conversion rates, but it also influences how search engines rank your site. One often overlooked factor affecting website speed, particularly in WordPress, is the Emoji Autoload feature. Let’s delve into this feature and discuss its implications on site performance.

UNLIMITED DOWNLOADS: Email, admin, landing page & website templates

Starting at only $16.50 per month!

What is Emoji Autoload in WordPress?

Emojis, those fun little icons we often use in our digital conversations, are universally supported on almost all devices and browsers. To ensure emojis display correctly across all platforms, WordPress introduced the Emoji Autoload feature in version 4.2. This feature, which is part of the core WordPress functionalities, automatically loads a JavaScript file (wp-emoji-release.min.js) on every page of your WordPress site, impacting the site’s loading speed.

While this ensures a consistent emoji experience across all devices, it also adds an extra HTTP request to your site on every page load. In the world of web performance, each HTTP request can add to your site’s load time. For websites that do not rely heavily on emojis, this feature can slow down the site unnecessarily.

Why You Should Disable Emoji Autoload

Optimizing your WordPress website for speed involves minimizing unnecessary HTTP requests, including those made by features like Emoji Autoload. By disabling the Emoji Autoload feature in WordPress, you eliminate one such HTTP request from every page load, thereby enhancing your website’s speed. Remember, in the speed race, every millisecond counts. As per the HTTP Archive, among the top contributors to page bloat are HTTP requests.

How to Disable Emoji Autoload

Disabling Emoji Autoload is straightforward and involves adding a short code snippet to your theme’s functions.php file. Remember, before editing any theme files, ensure you have a recent backup of your site and preferably use a child theme to prevent issues when updating your theme.

Here is the code snippet to disable Emoji Autoload:

remove_action('wp_head', 'print_emoji_detection_script', 7);
remove_action('wp_print_styles', 'print_emoji_styles');

This code stops the emoji script from loading on your site, thereby eliminating the associated HTTP request.

The code snippet is made up of two functions:

  • remove_action(‘wp_head’, ‘print_emoji_detection_script’, 7); – This line tells WordPress to stop printing the emoji detection script into the <head> of your website.
  • remove_action(‘wp_print_styles’, ‘print_emoji_styles’); – This line does the same for the emoji styles, preventing them from being printed on your site.

When adding these two lines to your functions.php file and saving your changes, you effectively disable the Emoji Autoload feature.

Wrapping Up

Optimizing your WordPress site for speed involves many tweaks and adjustments, and disabling Emoji Autoload is just one of them. It’s a small change that can contribute to a faster, more efficient website, particularly if emojis are not a critical part of your site’s content. After making these adjustments, it’s crucial to assess the impact on your website’s performance. You might consider using a tool like Lighthouse to monitor your website’s page experience.

Bonus💡: How to Monitor Website Page Experience with Lighthouse

]]>
How to Setup a WooCommerce Store for Point-of-Sale Purchases https://1stwebdesigner.com/how-to-setup-a-woocommerce-store-for-point-of-sale-purchases/ Tue, 01 Nov 2022 08:34:55 +0000 https://1stwebdesigner.com/?p=158493 Taking point-of-sale orders is a thrilling prospect. Imagine this: customers come up to your popup store or vendor booth at a convention or fair, find the products they’re looking for, and make a purchase right then and there without having to wait in line or worry about stock availability.

This could be a game-changer for your business, and luckily, it’s not too difficult to set up a WooCommerce point-of-sale system. If you’re looking to start taking point-of-sale (POS) payments for your WooCommerce store, then this guide is for you.

Let’s get started!

UNLIMITED DOWNLOADS: 500,000+ WordPress & Design Assets

Sign up for Envato Elements and get unlimited downloads starting at only $16.50 per month!

What is Point-of-Sale?

Point-of-sale (POS) refers to the location where a customer makes a purchase. This can be either in-person or online.

In-person POS purchases are made using electronic terminals, which are also known as point-of-sale machines. These machines are connected to a central computer system that processes and records the transaction. The customer’s bank account is then debited for the purchase amount and the funds are transferred to the seller’s account.

Online POS purchases are made using a payment gateway, which is a software that processes and records online transactions. The customer’s bank account is then debited for the purchase amount and the funds are transferred to the seller’s account.

There are many benefits of taking POS orders, such as:

  • Increased efficiency and accuracy of orders
  • Reduced wait times for customers
  • Ability to upsell and cross-sell products
  • Increased customer satisfaction

With those specifics out of the way, let’s move on to setting up your WooCommerce point-of-sale system.

How to Set Up a WooCommerce Point-of-Sale System

There are two main components to setting up a point-of-sale system with WooCommerce: the hardware and the software.

The hardware refers to the physical devices that will be used to take and process payments. This includes the point-of-sale machine, receipt printer, barcode scanner, and cash drawer.

The software refers to the software that will be used to manage your POS system. This includes the WooCommerce point-of-sale plugin and a payment gateway.

Point-of-Sale Hardware

There are many different types of POS hardware available on the market, so it’s important to choose the right devices for your needs.

The most important thing to consider is compatibility. All of your point-of-sale hardware must be compatible with the software you’re using. For example, if you’re using s specific WooCommerce POS plugin or extension, then you’ll need to use hardware, such as a USB receipt printer and barcode scanner, that works with these systems.

If you only intend to conduct POS transactions on occasion, an in-person transaction device like those available from payment processors may be all you need.

Point-of-Sale Software

Point-of-Sale Software

Point of Sale for WooCommerce is a great option for managing your POS system. It’s compatible with all major payment gateway providers and offers many features, such as:

  • Inventory management
  • Customer management
  • Coupons and discounts
  • Sales reporting
  • Tax calculations
  • Compatibility with multiple registers
  • Store department support

This extension is available for $199 per year.

Other plugin or extension options include wePOS and Square for WooCommerce.

Payment Gateway

In order to accept payments, you’ll need to connect a payment gateway to your WooCommerce. A payment gateway is a software that processes and records online transactions.

There are many different payment gateway providers available, so it’s important to choose one that’s compatible with WooCommerce, of course. Some popular options include PayPal, Stripe, and Square.

Once you’ve chosen a payment gateway, you’ll need to create an account and obtain the appropriate credentials, such as an API key or code snippet. These credentials will be entered into the settings page for WooCommerce.

How to Use a WooCommerce Point-of-Sale System

Using a WooCommerce POS system is fairly simple. The first thing you’ll need to do is add your products to the system. This can be done by manually entering the product information or by scanning the product’s barcode.

Once your products have been added, you’ll need to create a customer. This can be done by entering the customer’s information.

Next, you can add products to their order. This can be done by scanning the product’s barcode or by searching for the product by name.

Once you’ve added all of the products to the order, you can proceed to checkout. At checkout, you’ll need to select a payment method and enter the appropriate information.

Depending on the system you’ve selected, the customer may be able to tap their payment card against your payment processing device. Or you may need to use a scanner or card slider. Once payment has been processed, you can print a receipt for the customer. You can also email or text the receipt to the customer if they prefer.

How to Use a WooCommerce Point-of-Sale System

And all of this order information including inventory tracking will be reported within WooCommerce, which you can view later via the WordPress dashboard.

And that’s it! You’ve now successfully completed a transaction using your WooCommerce point-of-sale system.

Point-of-Sale Purchases Within WooCommerce Open New Opportunities for Businesses

Utilizing a WooCommerce point-of-sale system can be a great way to streamline transactions and better manage your business. If you’re looking for a way to take your WooCommerce store to the next level, consider adding POS capabilities.

]]>
7 Full Site Editing WordPress Themes for 2022 https://1stwebdesigner.com/7-full-site-editing-wordpress-themes-for-2022/ Wed, 19 Oct 2022 08:51:05 +0000 https://1stwebdesigner.com/?p=158475 WordPress has undergone quite a few changes as of late. In the past few years alone, there have been major updates to WordPress core, changing how people interact with the CMS in major ways. The biggest innovation is the addition of full site editing to WordPress. We’ve already gotten acquainted with Gutenberg and how the Block Editor has transformed the way blog posts and pages are created. But now, the aim is to adjust how we customize entire websites from within WordPress as well.

And while this might sound a bit scary at first, rest assured, there are still plenty of WordPress themes created every day that incorporate this new feature and make it easier than ever to design and customize websites in WordPress.

That’s precisely what our focus will be here today. Let’s take a look at 7 full site enabled WordPress themes that make full site editing accessible and familiar.

Your Designer Toolbox Unlimited Downloads: 500,000+ Web Templates, Icon Sets, Themes & Design Assets

Twenty Twenty-Two

Twenty Twenty-Two Full Site Editing Theme

The TwentyTwenty-Two WordPress theme was created with the belief that everyone deserves a website that is truly one-of-a-kind. The theme’s understated styles take inspiration from birds, which are themselves known for their diversity and versatility. The typography in the theme is light yet strong, the color palette is inspired by nature, and the layout elements are designed to sit gently on the page.

Twenty-Two is meant to be easily customizable, taking advantage of WordPress 5.9 Full Site Editing capabilities. This means that the colors, typefaces, and site layout of each individual page on your site can all be altered to match your preferences. It also includes several block patterns for you to use in creating professionally designed layouts with just a few clicks.

Catch FSE

Catch FSE

Catch FSE is a responsive, minimal WordPress theme with a dark or light color scheme. It’s been created using Twenty Twenty-Two and is ideal for blogs and corporate sites, alike. You can select your site color style in WordPress 6.0’s Global Styles feature and start creating your content with the easy drag-and-drop interface by utilizing block patterns.

It’s free and easy to use, with a clean, modern aesthetic. It allows you to create a distinctive site by providing 15 distinct block patterns, 15 FSE Templates, and 9 Template Parts so you can build your own website the way you want it.

Bricksy

Bricksy Full Site Editing WordPress Theme

Bricksy is perfect for those who want to build their own modern website without having to code or design from scratch. With an easy drag-and-drop interface, you can use the premade block patterns to create beautiful pages in minutes.

The theme takes full advantage of WordPress’ Full Site Editing features, making it easier than ever to create a professional site that looks great and functions as you want – no compromises required.

Allele

Allele Full Site Editing WordPress Theme

Allele is a WordPress theme that comes with pre-defined block patterns and full-page templates. It has a modern, clean design and provides full site editing support. This theme is perfect for creating professional websites that need to be edited often.

Other features of this theme include support for multiple languages and RTL, it’s accessibility-ready, it’s SEO friendly, and it’s lightweight, too.

Avant-Garde

Avant-Garde Full Site Editing WordPress Theme

Avant-Garde is a simple, experimental block theme for WordPress. It features an easy-to-use interface and a minimal design, perfect for those who want a streamlined blog or website.

The theme is fully responsive and retina-ready, ensuring that your content looks great on any device. Avant-Garde is also translation-ready and supports the WPML plugin, making it easy to create a multilingual website.

The simple design here would lend itself well to a wide variety of content types and topics. And, if you’re wanting to experiment with a new design direction for your website, Avant-Garde could be the perfect theme to help you do just that.

Frost

Frost

The Frost WordPress theme is a well-designed and feature-rich theme that can be used for a variety of website types. The theme includes a hero section with an image and text, as well as a portfolio section to showcase your work. The theme also includes calls-to-action, testimonials, and more.

This versatile, mobile-optimized WordPress theme makes it easy for designers, developers, and creators to build a sophisticated website in minutes. With a user-friendly interface and a wide range of features, Frost is perfect for anyone who wants to create a powerful online presence.

Wabi

Wabi

Wabi is a WordPress block theme created to assist you in telling your story in the most effective way possible. The clean lines, beautiful typefaces, and dynamic accent color system used to aid with your storytelling. This is all further emphasized through the use of simple curves and lovely letterforms. Wabi comes with three different style variants (light, dark, and dynamics) for maximum expressiveness and flexibility.

Which Full Site Editing WordPress Theme Will Serve Your Next Project?

These are only a few of the hundreds of Full Site Editing WordPress themes available. But hopefully, this gives you a starting point for finding the perfect one for your next project. Good luck!

]]>
10 Best New Free WordPress Themes For May 2022 https://1stwebdesigner.com/10-best-new-free-wordpress-themes-for-may-2022/ Thu, 19 May 2022 09:33:41 +0000 https://1stwebdesigner.com/?p=158299 Looking for the best free WordPress themes that are so new very few, if any, other sites are using them yet? In this collection we’ve curated 10 of the best free WordPress themes that have come out in the month …

]]>
Looking for the best free WordPress themes that are so new very few, if any, other sites are using them yet? In this collection we’ve curated 10 of the best free WordPress themes that have come out in the month of May. Several of these free WordPress themes have pro/paid versions available, so be sure to check out what they have to offer and what paying for the premium version gets you. Without further ado, let’s take a look!

UNLIMITED DOWNLOADS: 500,000+ WordPress & Design Assets

Sign up for Envato Elements and get unlimited downloads starting at only $16.50 per month!



 

Adore Blog

Adore Blog is a dark minimal designed, very light weight and easy to use clean and blog theme. This Theme is suitable for any lifestyle, fashion, photography, food, beauty, cosmetic, or any blog in a specific niche. It is designed with beautiful layouts and practical features to give that modern look to the site without compromising the content. The theme allows you to customize your website as per your desire via the WordPress Customizer. It is a fully responsive theme that will display your content accurately on every device. DEMO

Adore Blog - Best New Free WordPress Themes For May 2022

Engineering Manufacturing

Engineering Manufacturing is a great theme created with engineering, construction, heavy industries, manufacturing units, factories, refineries, oil plants, and relevant businesses in mind. It is an elegant free theme with a multipurpose use and impresses everyone with its minimal design. It is amazingly sophisticated to put forward the best face of your business. Besides being user-friendly and a fully responsive theme, it has a retina-ready design that can make your content, as well as the images, look incredible on every screen. DEMO

Engineering Manufacturing - Best New Free WordPress Themes For May 2022

Rasam

Rasam is a Creative, Modern, and Professional Restaurant WordPress Theme. The theme is perfect for Restaurants, Fast Food, Seafood restaurants, Recipes, bakeries, burgers, Coffee Shops, Pizza Shops Websites, who need an easy, attractive and effective way to promote your food related services. DEMO

Rasam - Best New Free WordPress Themes For May 2022

VW Dark

VW Dark is a fantastic WP theme that will be suitable for multiple business types and professions such as media agencies, fashion stores, designers, marketing experts, consultancies, creative designers, entrepreneurs, etc. Basically, you can use this theme as a multipurpose theme. It is minimal in style and crafted by expert developers for bringing a professional design that wonderfully works for your business. DEMO

VW Dark - Best New Free WordPress Themes For May 2022

Digital Marketing Expert

Digital Marketing Expert is a modern and clean WP theme for marketing agencies, digital marketing professionals, online marketing agencies, social media agencies, SEO companies, SEO marketing, SEO optimization service providers, creative and digital experts, branding agencies, and similar services. It is a multipurpose theme with a minimal approach and comes with a sophisticated layout that makes your website look more professional. Retina-ready design is going to impress through a stunning display of images as well as the content. DEMO

Digital Marketing Expert - Best New Free WordPress Themes For May 2022

Moina Blog

Moina Blog Theme is wordpress blog theme for personal use. Fully responsive design displays beautifully across desktop, mobile, and all devices. Easy installation allows you to start post blogs immediately after the activation. DEMO

Moina Blog - Best New Free WordPress Themes For May 2022

Refined Blocks

Refined Blocks is a free Magazine WordPress theme. It is a child theme of Refined Magazine with added features and options. It is easy to use, customize and lightweight WordPress theme. In addition to that, this theme comes with one click demo import option, 9 added custom widgets and unlimited color possibilities. DEMO

Refined Blocks - Best New Free WordPress Themes For May 2022

Jatra

Jatra is an interactive, modern, multi-purpose WordPress magazine theme. Suitable for newspapers, magazines, publishers, blogs, editors, online and gaming magazines, news portals, personal blogs, newspapers, and any other creative website. Jatra is SEO friendly, WPML, Gutenberg, translation, and RTL ready. DEMO

Jatra - Best New Free WordPress Themes For May 2022

Dancing Star

Dancing Star Lite is the ideal choice when it comes to picking up a free dance school WordPress theme for your dance school or studio. This minimalistic and professional-looking multipurpose theme is highly functional and efficient. This Free dance school WordPress theme perfectly suits any ballet class, dance school, dance academy, dancing studio, dance instructor, fitness, dance club, jazz, salsa, Zumba, choreography and related websites. This theme can also be used for martial art training classes, aerobics classes, yoga centres, fitness trainer, musical projects, bands, radio, orchestra, studios, and more. DEMO

Dancing Star

Gardener Lite

Gardener Lite comes with an excellent design for suitable elements and content spaces along with imagery complementing your gardening services perfectly. Flower gardens, landscapers, landscaping experts, and gardening service providers will love the minimal design it brings. It is sophisticated enough to catch the attention and gives a professional appeal. DEMO

Gardener Lite

]]>
How To Create A Star Rating System In WordPress With CSS and ACF https://1stwebdesigner.com/how-to-create-a-star-rating-system-in-wordpress-with-css-and-acf/ Tue, 19 Apr 2022 10:46:47 +0000 https://1stwebdesigner.com/?p=158244 I recently had a request from a WordPress client for a star rating widget of sorts, so I thought I would share the solution I came up with using Advanced Custom Fields (ACF) and CSS. There are no images involved – just pure CSS plus Unicode stars and a handy range slider on the back end so the client can easily enter a rating anywhere from 0 to 5 in steps of 0.1. Thanks to a nice example I found on CodePen (seen below), the front end elements were easy and simple, utilizing CSS custom properties and variables in a compact code. Connecting this to ACF so the client could easily edit their ratings brought it all together in a quick solution that I have not seen elsewhere, thus the idea to make it available here in case anyone else is looking for something similar. Ready to dig in?

UNLIMITED DOWNLOADS: 500,000+ WordPress & Design Assets

Sign up for Envato Elements and get unlimited downloads starting at only $16.50 per month!



Coding The Stars

See the Pen
Tiny but accessible 5 star rating
by Fred Genkin (@FredGenkin)
on CodePen.0

 

As you can see from the above CodePen, there is not much involved, yet it is a cleverly coded idea. This is taken from a great tutorial over on CSS Tricks, called “Five Methods for Five-Star Ratings”. The HTML below utilizes a custom CSS property (--rating) and makes no calls to the server while maintaining accessibility.

<div class="stars" style="--rating: 2.3;" aria-label="Rating of this product is 2.3 out of 5."></div>

The property is actually a conversion from a value to a percentage that’s handled in CSS using the calc() function:

--percent: calc(var(--rating) / 5 * 100%);

Then the filling of the stars based on the rating/percentage is done using a linear-gradient background that creates hard color stops at the percentage points that are designated.

background: linear-gradient(90deg,
  var(--star-background) var(--percent), 
  var(--star-color) var(--percent)
);

In the CodePen example, the author uses CSS variables for the star size, color, and background. You can go this route if you want to be able to change those elements easily, or you can just code them in yourself if you have no plans to change them down the road.

background: linear-gradient(90deg,
  #fc0 var(--percent), 
  #fff var(--percent)
);

Once the stars code is done, we can now make it work with the ACF range slider.

ACF Range Field

I’m assuming you are already familiar with Advanced Custom Fields, since you arrived at this article with it in the title. If not, you can learn more about the plugin here.

For our use case, we want to create a Range field so the client can select a range from 0 to 5 in steps of 0.1, enabling them to set the star rating at 4.7, for example.

In the WordPress backend, navigate to Custom Fields > Add New to create a new field group, then give it a title and click the button labeled Add Field to create the new field. Add the Field Label (we’re using “Stars” in our example), select the Range field type, set the Maximum Value to 5, and the Step Size to 0.1. You can make any other edits you see fit, but these are the minimum to get this working the way we want it to work.

Star Rating field

After saving your changes, you can now edit whatever page, post, or template PHP file in which you want to show the star rating by entering the following code:

<?php
$stars = get_field('stars');
if($stars) echo '<div class="stars" style="--rating: '. $stars .'" aria-label="Rating of this product is '. $stars .' out of 5."></div>';
?>

This code replaces the HTML we were originally using, and now it will show the rating that is set on the backend when the Range field is updated. Pretty simple, right?

Star Rating Range Slider

For reference, here’s the complete CSS that will make the magic happen (derived from the SCSS in the CodePen).

.stars {
    --percent: calc(var(--rating) / 5 * 100%);  
    display: inline-block;
    font-size: 60px;
    font-family: Times; 
    line-height: 1;
}
.stars::before {
    content: '★★★★★';
    letter-spacing: 2px;
    background: -webkit-gradient(linear, left top, right top, from(#fc0), to(#fff));
    background: linear-gradient(90deg, #fc0 var(--percent), #fff var(--percent));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

 

]]>
Pricing Tables: Best Designs and WordPress Plugins https://1stwebdesigner.com/pricing-tables-best-designs-and-wordpress-plugins/ Wed, 27 Oct 2021 16:13:03 +0000 https://1stwebdesigner.com/?p=157573 If you’re a regular online shopper, you’ve definitely come across pricing tables before. Pricing tables are an important feature of websites that sell online. These tables help customers compare product features and prices.

Pricing tables need to be simple and …

]]>
If you’re a regular online shopper, you’ve definitely come across pricing tables before. Pricing tables are an important feature of websites that sell online. These tables help customers compare product features and prices.

Pricing tables need to be simple and easy to understand because they help users make an informed buying decision. A lot of information is likely to overwhelm the customer while too little or unclear information can be ineffective.

Other benefits of pricing tables include:

  • Tables help remove unnecessary clutter.
  • They save on space.
  • Provide a clear call to action.
  • Can attract more clients and generate more sales.

Now, it is important to note that not all WordPress themes have pre-built pricing tables, so you might need to download a plugin to integrate this feature.

UNLIMITED DOWNLOADS: 1,500,000+ Icons & Design Assets


 

What To Look For In A WordPress Table Plugin

Before we get to the list, let’s first pause to discuss what features are a must-have for any pricing table plugin you decide to use.

1. Pricing Table Templates

Look for plugins that offer several pricing table templates. This will help you in customizing your designs according to exactly what you’re looking for.

2. Price

If your website is small and you’re just looking for something simple, be sure to check the available free plugins before purchasing one. There are so many free plugins, many with a bunch of cool features.

3. Customization

You should look for a plugin that will allow you to customize your table according to your branding. That means custom colors, fonts, etc.

4. Integrations

Look for a plugin that can easily integrate with your WordPress theme so it works seamlessly.

WordPress Pricing Table Plugins

Below, we have identified some of the best pricing table plugins available and we hope you’ll find one that best suits your needs.

1. Go Pricing

Go Pricing - WordPress Pricing Table Plugins

Go Pricing is a table plugin that offers you almost 200 table designs. Its modern and stylish features will help you create the perfect pricing table for your website.

The plugin will help you customize your table without having to code. This is perfect for someone who isn’t familiar with web design.

It also offers you 200 templates, 2,000+ font icons, over 600 fonts, an unlimited color selection, modern media options, and more.

Some of its pros and cons include:

Pros

  • Has extensive customization options and is feature-rich.
  • Has a live preview option that allows you to see how your table will look at the end.
  • Popular with page builders like Elementor, WP Bakery, and Beaver Builder.
  • Has a column animation feature.

Cons

  • You have to be on a paid subscription to download table templates.

2. Responsive Pricing Table

Responsive Pricing Table

Responsive Pricing Table is a free WordPress plugin that has a shortcode that allows you to show your table anywhere on the website. It adds a pricing table tab in the admin section which makes adding a pricing table easy.

With the many features it offers, you’re able to: add different colors to your table, choose unique fonts, and more.

Some of its pros and cons include:

Pros

  • Easy to create and customize.
  • Can be used to compare products.
  • You can change the currency sign.
  • You can highlight any plan.

Cons

  • Poor customer support.

3. CSS3 Responsive WordPress Compare Tables

CSS3 Responsive WordPress Compare Tables

The CSS3 Responsive pricing table is a premium plugin with several customization features. It comes with two table styles and 20 predefined color options.

It also offers a number of features that will help you create the best tables for your site such as hover animations, pop-ups, and ribbons. This plugin is perfect for creating beautiful pricing tables.

Some of its pros and cons include:

Pros

  • Allows you to see your changes in real-time.
  • Can highlight columns and customize fonts.

Cons

  • You need CSS if you wish to access more customization features.
  • Comes with only two table styles and 20 color themes.
  • Can be time-consuming to set up.

4. ArPrice Pricing Tables

ArPrice Pricing Tables

This is a free and premium WordPress plugin that allows you to make responsive pricing tables that can be used on multiple devices. Some of its features include the ability to create an animated pricing table.

With ArPrice you have a selection of over 170 already made templates to choose from. You can also use the drag and drop editor to adjust and resize columns as needed.

ArPrice has a real time editor feature that will make the customization of your site easier.

Some of its pros and cons include:

Pros

  • Allows language translation.
  • It’s lightweight.
  • Easy to use.
  • Offers a variety of colors.

Cons

  • Can be slow at times.

5. Easy Pricing Tables

Easy Pricing Tables WordPress Plugin

Easy Pricing Tables is a WordPress plugin that lets you create your tables with ease. The plugin is easy to use and gets the job done quickly. It includes predefined colors and themes. With this plugin you get 120+ ribbons, a live preview, 100+ content elements, and more.

Some of its pros and cons include:

Pros

  • Easy to use.
  • Has the drag and drop feature.
  • Gutenberg compatible.
  • Compatible with all WordPress themes.

Cons

  • No cons found.

Best Pricing Table Designs

So, you now know about a few pricing table plugins that can help you display pricing information in a straightforward way. But if you’re stumped on design inspiration, we’ve compiled a shortlist of some top designs to add some fuel to your design fire.

1. Shopify

Shopify pricing table

The Shopify pricing table is one of the best around because its layout makes it easy to compare different plans. And the prominent Free Trial buttons encourage conversions.

2. Dropbox

Dropbox pricing table

The Dropbox table layout makes it easy for buyers to compare pricing and features. This helps users get to know what exactly they are purchasing and decide on what works better for them.

3. Slack

Slack pricing table

Slack’s pricing table uses different colors to highlight different available plans. This makes the table more eye-catching and is likely to grab the customer’s attention. Each plan comes with a description of how they are billed and also includes a call-to-action.

4. Airtable

Airtable pricing table

Airtable is another great example of a pricing table that uses colors to grab attention. It has a simple design that draws focus to the features available on each plan.

There’s also a monthly or yearly option at the top of the table that helps you select your preferred plan.

5. LightCMS

LightCMS pricing table

LightCMS is another great example of a well designed pricing table. They have incorporated different colors to grab attention and to highlight the different available plans. They’ve also used different font sizes for comparison.

Conclusion

A well designed pricing table is likely to grab the consumer’s attention. If you’re looking for a good pricing table for your website, we hope this list of plugins and designs has helped you figure out what will work best for your site. Best of luck! Be sure to check out our other articles about WordPress plugins while you’re at it.

]]>
Top Free & Premium WordPress Calendar Plugins https://1stwebdesigner.com/top-free-premium-wordpress-calendar-plugins/ Wed, 29 Sep 2021 12:35:41 +0000 https://1stwebdesigner.com/?p=157324 There’s nothing as satisfying as ending the day feeling accomplished in all that you had planned to do. It may not be practical to have a tight everyday schedule because well, life happens, but it’s no doubt that calendars help …

]]>
There’s nothing as satisfying as ending the day feeling accomplished in all that you had planned to do. It may not be practical to have a tight everyday schedule because well, life happens, but it’s no doubt that calendars help keep us organized. Sharing events online where everyone can easily access is becoming more and more common. WordPress offers a number of plugins to choose from for this very purpose. WordPress calendar plugins are ideal for scheduling things like boardroom meetings, work events, family meetings, and other important dates.

These plugins have features like time tracking and event-hosting capabilities.

Though you can expect better features from premium plugins, here’s a list of some top free WordPress Plugins that can work just fine.

UNLIMITED DOWNLOADS: 500,000+ WordPress & Design Assets

Sign up for Envato Elements and get unlimited downloads starting at only $16.50 per month!



 

5 Top Free WordPress Plugins

You don’t need to have room in the budget to add a calendar feature to WordPress. In fact, there are several free plugins available to choose from. Let’s explore five top options now.

1. All-in-One Event Calendar

All-in-One Event Calendar - WordPress Calendar Plugins

The All-in-One Event Calendar has a unique way of presenting events to users compared to other free plugins. It allows for the easy import and export of calendar feeds that make it possible for events on one website to automatically appear on a calendar opened on a different website. This makes it easy when scheduling important events that should not be overshadowed.

The plugin also allows you to assign different colored categories to tasks and events.

Some of its features include:

  • Has widgets for scheduling upcoming events.
  • Embedded Google Maps.
  • Can be customized using theme options.
  • Has a day, week, and month view.

2. Modern Events Calendar Lite

Modern Events Calendar Lite - WordPress Calendar Plugins

This type of plugin is a good choice if you’re running a booking or events website. The calendar design displayed to users is newer and more modern compared to other free plugins. You can access different calendar views like monthly view, daily view, full calendar, countdown, and carousel view.

There are many features available on this plugin like BuddyPress and some MailChimp integrations. There’s also a feature that allows you to directly import events from the Google events calendar in various file formats including XML, CSV, and JSON.

Some of its top features include:

  • Provides different views for events.
  • Can be used by multiple workers. Works well in a group setting.
  • Offers customer customization for different categories.

3. My Calendar

My Calendar - WordPress Calendar Plugins

The My Calendar plugin is built with ease of accessibility and use in mind. It provides flexibility to designers or developers who need a customized plugin calendar.

On My Calendar, you can create recurring events and edit them separately. It also offers widgets that show both upcoming events and events of the day.

If you want a more customized feel, you can easily change the font, margins, primary colors, padding, and borders.

Some of its features include:

  • Has custom templates.
  • Daily, weekly, and monthly view.
  • Has list and grid view of events.
  • Has email notifications.

4. The Events Calendar

The Events Calendar - WordPress Calendar Plugins

The Events Calendar is the most popular and widely used free plugin for managing events. Whether your events require in-person or virtual meetings, the features available on this plugin are professional and easy to use.

The plugin gives you the option to specify the start time and end time of events. And for events that require venues, you can easily embed Google Maps on the calendar.

Some of Its features include:

  • Can save venues.
  • Has widgets for upcoming events.
  • Is completely responsive.
  • Has categories and tags for different events.

5. Easy Appointments

Easy Appointments - WordPress Calendar Plugins

This plugin is easy to use and is recommended for websites that manage appointments with clients. These can be websites used by doctors, lawyers, hairdressers, and lecturers especially if you’re constantly cancelling and rescheduling events.

It allows you to create events for multiple people, locations, and services. You can also have separate calendars for specific services or locations.

With Easy Appointments, you get email notifications when an event has been cancelled or postponed. You can also have different appointment categories like canceled, reserved, and confirmed.

Some of Its top features include:

  • Has email notifications.
  • Has an extremely flexible calendar.
  • Can be used by multiple people.
  • Can be accessed in multiple locations.

4 Top Premium WordPress Plugins

Now, if you do have some room in your budget for a calendar plugin, rest assured there’s no shortage of high-quality ones available. Here’s some of our favorites:

1. Bookly PRO- Appointment Booking and Scheduling Software System

Bookly PRO - WordPress Calendar Plugins

Bookly PRO is an add-on that requires the Bookly plugin for WordPress Websites. With this plugin, you don’t need to endure face-to-face meetings or long phone calls. Your clients can just book appointments directly on the website.

This paid premium plugin offers automated online booking and scheduling features with fully customizable booking forms that have online payment options, google calendar sync, and notifications.

Reviews from loyal users agree that Bookly PRO is a premium and easy to use plugin that saves you hours on chasing clients.  The developers are constantly updating and including suggested features based on user votes.

Some of its top features include:

  • Has a number of templates for customizable emails.
  • Can be synchronized with Google calendar.
  • Offers multi-language support.
  • Has an unlimited number of services that can be put in different categories with unique colors.

2. Calendarize it! For WordPress

Calendarize it! WordPress Calendar Plugin

Calendarize it! is a flexible and feature-rich WordPress plugin that comes with add-ons which add even more functionality to the main plugin. You can use it for all day events and events with fixed timings.

The plugin also offers a number of views that can be customized like monthly view, week view, event grid view, event year view, and event map view.

Some of its top features include:

  • Has multiple widgets.
  • Has a number of pre-built color schemes.
  • Has monthly view, weekly view, and day view.
  • Users can customize colors, styles, fonts.

3. Booked – Appointment Booking for WordPress

 Booked

Booked – Appointment Booking is a simple plugin that makes it easy for businesses to accept bookings online.

Some of its top features include:

  • Has custom time slots.
  • Has fields for additional information.
  • Colors for customizing your calendar.
  • Customizable emails.

4. WordPress Pro Event Calendar

WordPress Pro Event Calendar

The WordPress Pro Event Calendar is a professional looking calendar plugin that adds a stylish view to your event calendar.

Some of its top features include:

  • Has an elegant design.
  • You can create recurring events.
  • You can import events from Facebook.
  • Has a responsive layout.

Conclusion

When it comes to WordPress calendar plugins, finding one that works well for you is easy and doesn’t require any in depth knowledge to figure out how they work. A free plugin can work well if you need one for basic use. If you require a plugin for a more complex website with a lot of traffic, then premium is definitely the way to go. Either way, there’s no reason you can’t keep events more organized with one of these plugins in hand.

]]>