Jump to content

Home page widget area and a style like this

Recommended Posts


Hi John,

Those 5 boxes are simply HTML and CSS with some styling for the hover effect. To achieve something similar, you could try the following:

You could use the PageLines Grid system and then apply the HTML to your page. Then add custom CSS to style these boxes, below is an example:

<div class="row">
<div class="span4">
<div style="johnsBox1">
Add your HTML a link and/or image here
<div class="span4">
<div style="johnsBox2">
Add your HTML a link and/or image here
<div class="span4">
<div style="johnsBox3">
Add your HTML a link and/or image here
<div class="span4">
<div style="johnsBox4">
Add your HTML a link and/or image here

Please search our forums, before posting!

Share this post

Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Similar Content

    • Michael Kummer
      By Michael Kummer+
      Hi guys,
      I have been unsuccessfully trying to get my 3-column widgetized footer aligned centered. The widget section itself is aligned left because the alignment appears to be controller the widget's content only. The container that contains the widget section is aligned centered. I have chosen a 3 column layout and I added 3 widgets, assuming they would be aligned centered.
      Any idea of what I may be doing wrong?
      The page is question is: http://www.michaelkummer.com
    • novusweb
      By novusweb+
      We're seeing an abnormal break in widgets in Safari (El Capitan v10.11.4). 3 Widgets set for 4 of 12 columns each breaks correctly in Chrome and Firefox, but the 3rd widget goes to another line in Safari.
      Screenshot attached.
      Hoping there's a CSS fix you could recommend in the meantime, until an update. You can see this on our home page: www.novusweb.com.
    • richardjacruz
      By richardjacruz+
      I thought I had seen the last of this problem. However, please look at dev.stevensoncraneservice.com (the development site for our company). Every internal page looks fine. However, the home page is "broken" on every browser. However, when I'm logged in when using Chrome as a admin, the site checks out fine.
      Can you help me figure this out?
    • hibbsy78
      By hibbsy78+
      I have an issue with the widgets on my blog post page. The Facebook widget is being shifted up and next to the Mumii widget above...? How can I force it to remain underneath?

    • davidcosgrove
      By davidcosgrove
      This website http://itseasybeinggreenmovie.com/ is running DMS2 and I've run into a bizarre issue in Firefox.
      When the home page initially loads up, the top portion of it gets truncated and "hidden" behind the top nav section, hiding the top portion of the intro paragraph and the top portion of the YouTube video.
      Here is a screenshot of how it gets truncated - http://davidcosgrovesandbox.com/cutoff.png
      This is how it should look (and does look upon refreshing) - http://davidcosgrovesandbox.com/not-cutoff.png
      That affected section is a canvas area, 600 pixels high, with a background image.
      For the time being, until this can be fixed, we just put the content in the WP-loop section, so the cutoff canvas area has been hidden for desktop and mobile users.  I want to enable it again once this can be fixed.
      If you need Admin access to look at anything please PM me and I will set you up.
      I've never run into this issue with DMS, it's a new one on me!  Thank you in advance for your help guys.