Find Out Width Of Divi Website

It isn’t the most obvious how to figure out or set the width of your Divi website. Follow these easy steps:

  1. In your WordPress dashboard, click on “Divi”, then click on “Theme Customizer”. This should be located under the “Divi” sub-menu.
  2. Click on “General Settings” (on the left side bar navigation).
  3. Click on “Layout Settings”.
  4. Under “Website Content Width” you should see the width of your site in px. You can also adjust it by either dragging the slider control or directly typing in a new width in px.

Create more columns rows (5+) in Divi

If you’ve played around with Divi, then you’ll realize there’s a default limitation to 4 columns that you can add per row. I am here today to show you how you can get around this with some CSS.

  1. Create a new row, with 1 column layout.
  2. Add a Divi Module of one of the following: Text or Blurb Module
  3. Inside the Advanced tab, then in the custom CSS area, inside the Main Element text block, add the following code:

4. Repeat step 3 until you have 5 Modules in total.

5. You will need to adjust the “width: 200px” to different numbers to see what fits best for your columns. But a good general rule of thumb is that you should divide the total width of your site by the number of columns you want, so that it equals. E.g.: 1200px width site, with 5 columns = 1200 / 5 = 240px. You should replace the width with: “width: 240px”.

If you need help with figuring out what your Divi website width is or how to adjust it, check out our post about Figuring Out The Width Of Your Divi Website.

How To Get Permalink Woocommerce URL in PHP

How To Get Permalink Woocommerce URL in PHP

There is a very easy way to get your Woocommerce shop URL, via a permalink:

Here is a reference to get a few more Woocommerce URL permalinks:

 

How to change Avada header search bar into Woocommerce search bar

The Avada WordPress theme integrates with Woocommerce very neatly. but there are small things like the Search Bar in the header that uses the old WordPress search page rather than the Woocommerce search page. The difference between the search pages is that the WordPress search page finds all matching results from not just Woocommerce products but also blog posts etc. The customer may only want to search for what is inside of Woocommerce.

Continue Reading