A A A

Please consider registering
guest

Log In Register

Register | Lost password?
Advanced Search

— Forum Scope —

  

— Match —

   

— Forum Options —

   

Minimum search word length is 3 characters - maximum search word length is 84 characters

Topic RSS
How to use Custom Styles with BD (2.1+)
Business Directory Support
Admin
August 9, 2012 - 3:38 pm
Member Since: July 6, 2011
Forum Posts: 1416
Offline

Starting with 2.1, Business Directory incorporated the ability to pull styles from a custom CSS file that isn't overwritten on upgrade. For those with a quirky theme, or the desire to heavily customize BD's look to match their site, this is great news...

How to use the BD Custom Style CSS file:

1) Create a file called wpbdp_custom_style.css under wp-content/plugins on your site. This location won't be overwritten by any plugin or Wordpress on upgrade. You may also place this file under your theme directory as well.

The plugin is forgiving in locating the file--any of the following names will work for the custom style file, in EITHER location:
- wpbdp_custom_style.css
- wpbdp.css
- wpbusdirman.css
- wpbdp_custom_styles.css
- wpbdm_custom_style.css
- wpbdm_custom_styles.css

That means you should be careful not to have TWO custom files laying around. Pick one place, stick with it! I recommend the wp-content/plugins area as it can't be overwritten by a theme upgrade.

2) Place any style changes you need in this file. It will be loaded such that these changes will take precedence in the CSS hierarchy over other styles in BD.

How do I know what I want to put in this file?
- Good question! Use Firebug (http://getfirebug.com/) with IE or Firefox to determine what styles are being applied to any given element. Once you know what style is causing an issue, you can override it via the custom style CSS file.

Documentation: http://businessdirectoryplugin.com/docs FAQ: http://businessdirectory.com/support-forum/faq
rrkingcool
Guest
September 13, 2012 - 1:08 am

Thanks I've created the file spbdp_custom_style.css, placed it in the plugins folder and edited the title section from the original CSS. No change. Any more info on what specifically to do to make the font smaller? I've removed the H1 tag, Changed it to H4 etc nothing happens. I must be doing something wrong. 

 

.ldetails { padding:10px; background:#eeeeee;}
#lco { width:100%; -moz-box-shadow: 0 5px 5px #dddddd;
-webkit-box-shadow: 0 5px 5px #dddddd;background:#f7f7f7; margin:10px 0;}
#lco .title { width:50%;float:left;padding:10px;font-weight:bold;font-size:10px;margin-top:5px;}
#lco .title { border:0;margin:0;}
#lco .button { float:left;width:40%;padding:10px;}
#lco .button input { }
#lco .title input { }
#lco .title .submitlistingbutton { margin-right:10px; }
#lco .button .viewlistingsbutton { margin-right:10px;}
#lco .button .submitlistingbutton { margin-right:10px;}

Business Directory Support
Admin
September 18, 2012 - 3:34 pm
Member Since: July 6, 2011
Forum Posts: 1416
Offline

Those changes above don't look like they override Business Directory classes. Have you tried using Firebug to inspect the actual elements in your page to find out the correct class names and element IDs?

Documentation: http://businessdirectoryplugin.com/docs FAQ: http://businessdirectory.com/support-forum/faq
Forum Timezone: UTC 0

Most Users Ever Online: 103

Currently Online: mdwilliam09
8 Guest(s)

Currently Browsing this Page:
1 Guest(s)

Top Posters:

Member Stats:

Guest Posters: 2246

Members: 525

Moderators: 0

Admins: 1

Forum Stats:

Groups: 1

Forums: 4

Topics: 4237

Posts: 18245

Newest Members: mehoshav

Administrators: Business Directory Support: 1416