• 0

DMS 2 Is it possible to put borders around widget boxes?


Question

Posted · Report post

I would like to place a border around each widget box, similar to the way that White House Pro does that. Is this possible within DMS2? Thank you.

Share this post


Link to post
Share on other sites

10 answers to this question

  • 0

Posted · Report post

Greetings Claude203 ,

You can add any css on the front end in the custom css section and then preview it by hitting ctrl+enter. On some occasions there may be a need to refresh the page in order to see the change. 

 

http://i.imgur.com/tCkJUzE.png

1 person likes this

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hi Claude203

I believe that "yes"

You can add some CSS rules like

 

"IN YOUR DIV"
{ 
margin-bottom: 1em;

border: 1px solid #bbb; 

border-top: 1px solid #ddd;

border-left: 1px solid #DDD; 

background: #fff;
}
 
This is the rule in the WhiteHousePro

 

Share this post


Link to post
Share on other sites
  • 0

Posted (edited) · Report post

Hi,

Try this I tested on my test site and it worked for me http://mytestdesigns.pw/

 

.widget {
  padding: 5px 5px;  /* this is to give room for the text so it s not touching the sides of the border*/
  border-radius: 15px;   /* you can ignore this */
  border: 1px solid #000000;  /* color of the border and size*/
}
 hope it helps
Edited by Aires
2 people like this

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Okay, thank you. I will definitely try these.

This brings up something very interesting. Maybe it is possible to use a lot or some of the White House Pro CSS in DMS2?

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hi Claude203

Yes, of course, you need to inspect and copy it.

 

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Dear batman,
 
{ 
margin-bottom: 1em;

border: 1px solid #bbb; 

border-top: 1px solid #ddd;

border-left: 1px solid #DDD; 

background: #fff;

}

 

I'm sorry this is a basic level question but where exactly should this CSS be placed? Thank you! 

 

Dear Aires, 

 

.widget {
  padding: 5px 5px;  /* this is to give room for the text so it s not touching the sides of the border*/
  border-radius: 15px;   /* you can ignore this */
  border: 1px solid #000000;  /* color of the border and size*/
}
 
I understand about the .widget class, but again, where should this be placed? I have looked at the CSS file for DMS and cannot find anything that looks familiar.
 
Thank you both!

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hi again

 

Please, you can try add CSS code to a Child Theme.

I use for this a Danny´s Child Theme, this works fine to me in all update.

https://github.com/Dannyholt/skeleton

 

You can install the .zip like a theme in your dashboard > themes > upload

You need activate the Theme and the copy/paste yours CSS rules in the style.css

http://screencast.com/t/sZXzimY7x

 

I use the Child because I read this after update the theme

Please Note: Any customizations you have made to theme files will be lost. Please consider using child themes for modifications.

You can see the image

http://screencast.com/t/FeFQEG1Qav

 

Also, you can take a look to this

http://docs.pageline...ase-child-theme

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hmm. OK, thank you. I will first try to read and re-read your comment to understand it better, since I am not an expert. But I think I also must do the appropriate homework to learn. Then I will try these suggestions. Again thank you very much!

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

I'll be d**ned! Thank you Aries! This is a great start! Now I can start messin' around! I think I get it!

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

NP

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