How To Add Placeholder Text in Contact Form 7 WordPress Plugin

How To Add Placeholder Text in Contact Form 7 WordPress Plugin

Contact Form 7 WordPress plugin allows you to add Placeholder text. So, you can eliminate the standard Your Name (required) next to the input fields and use HTML5 Placeholder.

This is how a placeholder can be added in Contact Form 7.

Placeholder text for Name Field in Contact Form 7
[text your-name placeholder "Your name here"]
Contact Form 7 Text Field Placeholder Text

Placeholder text for Email Field in Contact Form 7
[email your-email placeholder "Your email here"]
Contact Form 7 Email Field Placeholder Text

Placeholder text for Telephone Field in Contact Form 7
[tel tel-103 placeholder "Your phone no"]
Contact Form 7 Telephone Field Placeholder Text

Placeholder text for URL Field in Contact Form 7
[url url-75 placeholder "https://example.com/"]
Contact Form 7 Url Field Placeholder Text

Placeholder text for Number Field in Contact Form 7
[number number-212 placeholder "Number of members"]
Contact Form 7 Number Field Placeholder Text

Placeholder text for Select Option in Contact Form 7
[select Text first_as_label "Select Option" "Option 1" "Option 2"]
Contact Form 7 Select Option Field Placeholder Text

Placeholder text for Textarea in Contact Form 7
[textarea your-message placeholder "Your message here"]
Contact Form 7 Textarea Field Placeholder Text

Below are the complete Shortcodes used to Add Placeholder Text in Contact Form 7.

Contact Form 7 Placeholder Code

This is the complete contact form resulted after implementing the Shortcodes, as mentioned above.
Placeholder Text in Contact Form 7

Placeholder in contact form 7 can be used for fields like text, email, url, tel, textarea, select, number.

Divi Blurb Extended – a Plugin to Enhance Divi Blurb

Divi Blurb Extended – a Plugin to Enhance Divi Blurb

Editor’s Note: This post was originally published on November 2017, and has been updated for accuracy and comprehensiveness.

Divi Blurb Extended is a Divi blurb layouts plugin for Divi Theme that also works on Extra Theme and Divi Page builder. This is the second plugin launched by Elicus Technologies for Divi after Divi Blog Extras and is available on  DiviExtended.com.

This plugin comes with added features along with standard Divi Blurb functionalities. Divi Blurb Extended allows more control on creation of layouts with Divi.

Main features of Divi Blurb Extended

Read more button within Divi blurb
Icon Position on right
On-hover text and icon color change
Show icon and only display blurb content on hover
Icon shape includes Square, Hexagon, and Circle
Flip Box Effect
Directional Flip Box effects
Flip Box Animation Effects
Easebox effect
Border around blurb and icon
Use of Icon and image together
Change color on hover
Change image on hover
And much more

How to Install and Activate Divi Blurb Extended?

Divi Blurb Extended plugin can be ordered here. There are two types of licenses.

  1. Single site license
  2. Extended license

The single site license of Divi Blurb Extended is for single website use only. The extended license is for developers or users who want to use the plugin on more than 1 website.

The plugin zip file can be downloaded after the order and need to be installed as any other plugin. There is another step involved which is for the activation of plugin. The activation key can be obtained from Downloads page.

After the API key is saved and the plugin in activated, there will be Divi Blurb Extended module available in the module library.

How to Set up a section using Divi Blurb Extended?

Once the plugin is active, it can be used like any other Divi module by adding it to a page section.

Using Divi Blurb Extended plugin is extremely easy and it can be added to any page using Divi Builder in a standard and specialty section. Plus, with Divi Blurb Extended plugin, you get multiple blurb modules and layouts that are as follows:-

Modules in Divi Blurb Extended

Divi Blurb Extended Module
Advanced Flip Box Module

Both modules have multiple blurb layouts with amazing features and functionality that can be used to create attractive blurbs using the Divi Page Builder. Check out the live page of Divi Blurb Extended Module.

Available layouts in Divi Blurb Extended module

Classic Blurb Layout
Flipbox Blurb Layout
Easebox Blurb Layout
Borderbox Blurb Layout
Image Card Blurb Layout

The common features for all the layouts in Divi Blurb Extended modules are read more button, Icon on right, color change of icons, and more, to achieve desired blurb.

List of available layouts in Divi Blurb Extended module with Example.

Classic Layout

Here is an implementation where icon position, read more link, and border shape square is visible created using Classic layout.

Icons in Square and Hexagon shape along with Circle.

Flipbox Layout

Flipbox layout is similar to the Divi blurb but has added features of read more button and two new shapes along with Circle and Hexagon. Yet, you can get more like this example with a hover effect using Flipbox.

In this Divi Blurb Extended Flipbox layout, we have an image site section that can be created to show the image and name and a short description with hover. The ring in the middle is a static image.

Easebox Layout

On hover animation at the top of the blurb with Easebox layout.

Borderbox Layout

Borderbox layout comes with an option to create a border around the blurb, like the example above.

Image Card Layout

Image Card layout can be used to create really nice looking sections like image above.

Another layout created using Image card layout.

Available layouts in Advanced Flip Box module

Layout 1
Layout 2

Layouts in Advanced Flip Box module posses the similar features and functionality of Divi Blurb Extended module but they also have added features like Directional Flipbox effect and animation effects.

Layout 1

Using Layout 1 of Advanced Flip Box Module, you can create engaging and attractive blurb boxes that can flip in multiple directions. Top, Bottom, Left, and Right. In addition to these features of Layout 1, you can also use other customization options to make blurbs even more pretty just like the below Divi blurb example.

layout 1 Advanced Flip Module

Layout 2

Layout 2 of Advanced Flip Box module allows you to create beautiful Divi blurbs having multiple appealing animation effects that engages users more than anything. Check out the below blurb example created with Layout 2.

Layout 2 Advanced Flip Box module

These are the available options in Divi Blurb Extended and can be used to create layouts like shown above. The full demo site and order link are at the end of this article.

View Demo

Buy Now

Like this plugin and want to give it a shout? Share this link to your social media. Or you can also subscribe to our newsletter to get update about WordPress, Web Development, and everything related to digital.

Divi Edu – A  Divi Child Theme for Educational Websites

Divi Edu – A Divi Child Theme for Educational Websites

Divi is a theme which can be used to create almost any kind of website. Here is a child theme for Divi which could be used to create college and school websites.

Divi Edu is a child theme for Divi with a ready to import and can create a college or school website in a very short span of time. In this blog post, we are sharing some screen-shots, layouts and overall look and feel of Divi Edu.

The homepage of this theme comes with a very appealing layout in dark blue color scheme. It utilizes full width Divi header which can fit in many college or university website requirements. The next sections shows an impressive section which can be used to display a lot of information about a college or school with numbers module on the right.

The other sections of the homepage could be used to show information about major course categories, student facilities and social media info and links. The homepage ends with a elegant testimonial sections followed by a nice footer concept.

Divi Education Child Theme

Other ready to use available pages in Divi Edu – a child theme of Divi for College University or School webistes are:

  • Home
  • Available Courses (2 Layouts)
  • Individual Course Page (4 Layouts)
  • Careers
  • Faculty
  • Downloads
  • Our Mission
  • Our Vision
  • Admission
  • Facilities
  • Blog
  • Contact

There are also layouts for page which could be replicated easily and a new page can be created by adding these pages from Divi Library.

  • Fullwidth page
  • Page with right sidebar
  • Page with left sidebar

There are nice responsive tables which are available on the courses page in this Divi Child theme for educational institutions.

The plugin comes with a very nice footer effect. There is curtain effect implemented in the footer and it shows the footer in a very appealing way.

Other good things about Divi Edu are.

  • Ready to import page layouts.
  • Ready to import individual sections of many pages. If someone wants to use a section from one page to another, it can be done easily by adding it from library. There is a documentation available with each section name and screen-shot so that it can be easily implemented on any page.

The child theme is fully responsive to mobile devices with responsive typography and it automatically scales down the size of large headings for proper viewing on mobile devices.

Other good about this Divi School and College child theme is the providers of this child theme offer a free implementation like the demo on it’s customers websites. If a user orders it and want to set it up, they can contact support with hosting information and the Elicus Technologies support team (The creators of this child theme) will implement it on their domain or development website.

The images in the Divi Edu child theme are used primarily from pixabay and they could be used for free as per the terms and policies of pixabay.

Demo
Buy Now

Powerpack Divi Site With Multiple New Blog Layouts from “Divi Extended”

Powerpack Divi Site With Multiple New Blog Layouts from “Divi Extended”

Are you a Divi WordPress theme user who feel that there should be a better control on the blog module layout?

Currently, the default Divi blog module layout has only 2 options (grid and full width). In this blog we present a very pleasing set of category and divi blog layout for Divi theme by this company called “Divi Extended”.

“Divi Extended” is a new name in the theme or plugin market and this is the first Divi plugin that looks very impressive and can reform your blog module layout completely.

Here are the Divi Blog Page Layoutss created with Divi Blog Extras Plugin:

In order to use “Divi Extended” plugin, all you need is to get a copy of license which comes for $19 for single site and $49 for multiple sites. The plugin gets installed in seconds like any other plugin and add a module in the Divi module area.

Here is how it looks like and you can use native Divi Page builder to create the layout based on the available pre-built layout library which the plugin provides.

Here is an output of the plugin. The way it looks is impressive and you can keep the column width adjusted and use it either in full width or multiple column layout using Divi builder.
(The three layouts available in current version of the plugin)

Divi Blog Layouts Box Extended

Divi Blog Layouts Grid Extended

Divi Blog Layouts Fullwidth

Classic Blog Layout

Block Extended

Full Width Background Layout

If you like this Divi Blog Module Layout and want to check out the plugin in action or purchase it, here is the URL.

Click here to visit the plugin page and get your copy today

Live Demo

How to Fix WordPress Unknow Collation While Importing Database in phpMyAdmin

How to Fix WordPress Unknow Collation While Importing Database in phpMyAdmin

We came across an interesting situation while importing database of a WordPress website from one server to another that throws “WordPress Unknow Collation” error.

The error generated while importing the database (on destination server) which is downloaded from other (source) server simply halts the import process. This let only a few WordPress tables to get imported and remaining won’t get imported.

It says Unknown Collation and thus the database was not being able to get imported as the destination collation was not supported by the source database server. To fix this, we found a solution which runs a query on the database and update the collation.

If you have a similar error and want to give it a try, you can check this video and the link on description to download the file and run it on your server to Fix WordPress Unknow Collation While Importing Database in phpMyAdmin.