Column Class- Modern Portfolio home

[magzparmenter]

Hi,
I have been googling around to try to find the answer to one of my other posts which hasn't had any replies.

I am trying to make 3 widget areas in the Home-Portfolio area show inline. They are currently showing one above the other.
(About, Inspiration and Blog)

Could I use column classes to do this?

If so, what code and where should I put it?

Thanks so much 🙂

My site is http://chasingholy.co.uk

http://chasingholy.co.uk

[magzparmenter]

Can anyone help with this, please?

[DTHkelly]

Use this plugin to add Genesis column classes to each widget.

Widget CSS Classes

one-third first
one-third
one-third

[magzparmenter]

Hi Kelly,
Thanks for your help. I already tried that plugin and it didn't work so I'm really stuck.
I'll enable it again and anyone can feel free to have a look what might be going wrong.

Thanks again.

[DTHkelly]

Have you tested for plugin conflicts with Widget CSS Classes? Deactivate all other plugins, see if it works then. If so, reactivate other plugins one by one until it stops working.

Another option would be to shortcode the 3 widgets and in Text (not visual editor) use Genesis Column classes as divs.

https://wordpress.org/plugins/amr-shortcode-any-widget/

<div class="one-third first">[replace this with the shortcoded widget]</div>
<div class="one-third"> [replace this with the shortcoded widget]</div>
<div class="one-third"> [replace this with the shortcoded widget]</div>

[magzparmenter]

Thanks, I'll try those and see how it goes.
Just one question- what did you mean by text and not visual editor?

[DTHkelly]

https://make.wordpress.org/support/user-manual/content/editors/
http://wpshout.com/learning-love-wordpress-text-editor/

[magzparmenter]

Oh! Lol!
I thought I'd be doing something in CSS or functions.php

Thanks for your help.

Let's hope one of them works!

[magzparmenter]

I tried to decativate plugins and there is no conflict.

Am trying the shortcode plugin but am struggling a bit to figure out how to use it.

[DTHkelly]

I used Chrome Inspector to determine the name of the widget I wanted to shortcode. This example works on my site:
[do_widget "Sensei - Course Progress"]

Temporarily put all 3 widgets (that you want to shortcode) in any visible sidebar (like primary sidebar). Then use Firebug, Chrome Inspector, or Inspect Element to determine the name of each widget (in order to use AMR shortcode any widget).

Are you familiar with Firebug, Chrome Inspector, or Inspect Element?

http://www.studiopress.com/tips/using-firebug.htm
https://www.nutsandboltsmedia.com/how-to-customize-your-genesis-child-theme-with-chromes-inspector/

http://genesisthemes.co.uk/firebug-chrome-dev-tools-genesis-extender-plugin/

Find, Test & Modify The CSS in Your Themes Style.css File

[magzparmenter]

I use Firebug.
The current widgets are in the Portfolio area of the site. Do I need to move them?
They are Genesis featured page and Genesis featured post widgets.

I am still not sure how to actually shortcode them (where do I put the do_widget shortcode?)

[DTHkelly]

I can't look at your site - clicking on the URL just times out without opening.

Just use Firebug to determine the name of each widget.

Make sure you drag one of each widget into the AMR Widget Area. ADMIN > Appearance > Widgets > Widgets for Shortcodes

The shortcode[do_widget "Sensei - Course Progress"] is pasted into the WYSIWYG of the Text Editor (not the Visual Editor) of any page or post that you want these widgets to appear on.

<div class="one-third first">[do_widget "Sensei - Course Progress"]</div>
<div class="one-third"> [do_widget "Sensei - Course Progress"]</div>
<div class="one-third"> [do_widget "Sensei - Course Progress"]</div>

[magzparmenter]

Ah, I think the problem is that I am not wanting these in a page, but in the portfolio area on the homepage.
I am now concerned that you can't load my site now though! Any idea why that might be? I can see it on my tablet, phone and desktop.

[DTHkelly]

Ask your hosting provider to see if they can open your URL.

[magzparmenter]

I'm not sure what you mean.
The site has been live for a long time, I'm just redesigning it with a new theme.

[DTHkelly]

These are examples of WordPress Hosting Providers:
http://www.elegantthemes.com/blog/resources/wordpress-hosting-review

Who are you paying to host the website? Their support techs may be able to figure out why your URL does not open to your site (here in the US).

[magzparmenter]

I will check that out. It hasn't been a problem for the last year.
Thanks for letting me know.

In the mean time...my quest for my inline widgets continues! 😉

[DTHkelly]

This article includes a way to add CSS classes without the plugin that is not working for you.
http://www.wpbeginner.com/wp-themes/how-to-add-custom-styles-to-wordpress-widgets/

Alternative - a widgetized front-page.php template that puts your 3 widgets in column class divs

Create Custom Page Template With Widgets Like Your Home Page

[magzparmenter]

Thanks again. I'll check them out.

BTW, I asked a few of my friends in the US to see if my site loads and it did for three of them.

Hopefully it was just a glitch for you. But I'll keep checking it every now and then.

[DTHkelly]

That is good news - cheers!

[Author]

Posts