WordPress.org

Forums

[Plugin: Custom Field Template] Admin CSS (4 posts)

  1. randyhoyt
    Member
    Posted 6 years ago #

    I have been tweaking the Admin CSS -- thanks, Hiroaki, for making this available! -- to make it fit more into the wp-admin section. I am sharing this CSS, just in case other people might benefit from it. Add the following lines below the default CSS:

    #cft {border-top: 1px solid #E3E3E3; margin-top: 1.67em;}
    #cft_instruction { margin: 1.67em 0; }
    #cft dt { float:none; width:auto; text-align: left; margin: 1.67em 0;}
    #cft dt span { display: inline; padding-right: 1em;}
    #cft dt br { display: none;}
    #cft dt div { display: inline; font-weight: normal; padding-left: 1em;}
    #cft dd { float:none; margin:0 .5em; text-align:left; width:auto; }
    

    http://wordpress.org/extend/plugins/custom-field-template/

  2. babeburp
    Member
    Posted 6 years ago #

    I'm using Custom Field Template version 1.2.4. Great plugin, though more "how-to-use" instruction (for non programing user like me) would certainly help to save me alot of time in trial & error.

    I've been tweaking the Admin CSS (through trial & error), but nothing seem to change. Using the default code, the main issue I have with my display is the custom key are aligncentre even though it clearly states alignleft. Not sure why? Any help on this is appreciated.

    I've tried adding above codes to the default codes in the Admin CSS but no changes seen on the display... :-(

    Thanks in advance...

  3. Ginocolada
    Member
    Posted 5 years ago #

    For the sake of brevity I had to split my huge template in two columns.

    I also added some nice contrast to the labels, looks awesome in the quick-edit. Check here for more recently added ADMIN CSS code.

    #cft div { width:50%; float:left; clear:none; }
    #cft dl { clear:both; margin:0; padding:0; width:100%; }
    #cft dt { float:left; font-weight:bold; margin:0; text-align:left; width:20%; }
    #cft dt .hideKey { visibility:hidden; }
    #cft dd { float:left; margin:0; text-align:left; width:80%; }
    #cft dd p.label { font-weight:bold; color:#093E56; margin:0; border-bottom:1px solid #BDBDBD;background-color:#EEEEEE;}
    #cft_instruction { margin:5px; }
  4. Endolil
    Member
    Posted 5 years ago #

    The CSS code which works fine for me is:

    #cft dl {display: block; clear: both; margin: 7px 0 0 0; padding:5px 0 5px 0; width:100%;  }
    #cft dt {float:left; font-weight: bold; font-size: 83%; margin:0; padding: 3px 7px 3px 3px; text-align: left; width:24%;  background: #DFECF8;}
    #cft dt .hideKey { visibility:hidden; }
    #cft dd {float:left; margin:0; padding: 3px 2px 3px 3px;  text-align:left; width:73%;  background: #DFECF8;}
    #cft dd p.label {margin: 0; color: #3988D6; font-size: 80%;}
    #cft_instruction {margin: 14px 0 11px 0px; padding: 8px 7px 9px 7px; color: #145A69;	line-height: 160%; background: #E2F1B5;}

    Notice: I am using a 19' display with the compressed wordpress admin menu (only icons)!
    On smaller Displays and with the full size admin menu on the left it will probably break the edit screen!

Topic Closed

This topic has been closed to new replies.

About this Topic