Quali sono i tag id / classe CSS dell'amministratore standard?

Question

Quali sono i tag id / classe CSS dell'amministratore standard?

- 50
- 55834 2012-01-13
Esiste unelenco di ID/classi CSS di WordPress cheposso utilizzareper creare schermate di opzioni diplug-in che abbiano l'aspetto di unanormalepagina di opzioni di WordPress?Ne hotrovati alcuniper casoma sarebbe statobello avere unelenco.

Unesempio è questa classe:button-primary chefa sembrare unpulsante così:

Is there a list of WordPress CSS id/classes that I can use to build plugin option screens that look and feel more like a normal WordPress option page? I have found some through serendipity but it would have been nice to have a list.

An example is this class: button-primary That makes a button look like this:

admin wp-admin css

- Sembra solo unpulsante di salvataggio standardin WordPress.Se ottengo abbastanza reputazioneperpubblicare lafoto,mi mancano solo 2punti :)
  
  It just looks like a standard save button in WordPress. If i get enough reputation to post the picture, just missing 2 points :)
  - 0
  - 2012-01-13
  - Ole Henrik Skogstrøm
- Salve ... stofornendo una soluzionema chenon èesattamente rilevanteper questa domandama èmolto utileper lo sviluppo web.Ecco lo strumentoper sviluppatori web chemostra ogni singolainformazione di unapagina web.Siprega di scaricarlo da questo link: http://chrispederick.com/work/web-developer/verràinstallato come un addonfirebuge lo sipotrà usaremoltofacilmente.
  
  Hi there... i m giving a solution but which is not relevant exactly to this question but it is very helpful for web development. Here is the web Developer tool which shows each and every information of a web page. Please download it from this link: http://chrispederick.com/work/web-developer/ it will install as a firebug addon and you can use it very easily.
  - 1
  - 2012-01-13
  - w3uiguru
- Sembra carino @HappySinghmalguardato,buoni strumenti di sviluppo sono sempre utili :)
  
  Looks nice @HappySingh ill look at it, good dev tools are always handy :)
  - 0
  - 2012-01-13
  - Ole Henrik Skogstrøm

5 risposta

voti

- 15
- 2012-01-13
Installa questoplugine vedraituttiglielementi,la classee gli ID https://github.com/bueltge/WordPress-Admin-Style

Install this plugin and you see all elements, class and ids https://github.com/bueltge/WordPress-Admin-Style
- Bello!Questa è unabuona lista,ho solobisogno diprovarne alcuni.Spero anchein ulteriori rispostee suggerimenti :) sceglipresto una risposta!
  
  Nice! This is a good list, just need to test some out. Also hoping for more answers and tips :) pick an answer soon!
  - 0
  - 2012-01-13
  - Ole Henrik Skogstrøm
- 0
- 2013-11-18
Ilbackend di WordPress hagenerato classi "body".Non li homai visti documentatiin modoesplicito danessunaparte (anche se avreipotutoperderlo).Puoi vederlie come vengonogeneratinella sorgente admin-header.php .

Le classigenerate sonomolto simili a quellefront-end:

<body class="wp-admin no-js upload-php admin-bar branch-3-3 version-3-3-1 admin-color-fresh">
The WordPress backend does have generated "body" classes. I have never seen these explicitly documented anywhere (though I could well have missed it). You can see them and how they are generated in the admin-header.php source.

The generated classes are very similar to the front-end ones:

<body class="wp-admin no-js upload-php admin-bar branch-3-3 version-3-3-1 admin-color-fresh">

0

2017-08-29

Sono arrivato a questa domandaperché stavo creando unapagina di amministrazionepersonalizzata utilizzando add_menu_page () . Avraiintenzione diinserirei tuoi contenutitra

 <div class = "wrap">Your content.</div>

Questo attiveràil CSS dibackend di amministrazione standard di WordPressin modo che latuapagina di amministrazionepersonalizzata abbia un aspettonormale. In questo caso,gli altri div sarebberogestiti automaticamente da WordPress.

 class AdminScreen{

    public function __construct(){
        add_action( 'admin_menu', array( $this, 'doAddMenuPage' ) );
    }

    public function doAddMenuPage(){
        add_menu_page( "AdminScreen", "AdminScreen", 'edit_others_pages', 'AdminScreen', array($this, 'echoAdminPage') );
    }

    public function echoAdminPage(){        
        //Prints out the HTML into the output buffer:
        echo '<div class = "wrap"><h1 class = "wp-heading-inline">This looks good, finally!</h1></div>';
    }
}

I got to this question because I was creating a custom admin page using add_menu_page(). You're going to want to put your content between

<div class = "wrap">Your content.</div>

This will activate the standard WordPress admin backend CSS so that your custom admin page looks normal. Other divs would be automatically handled by WordPress in this case.

class AdminScreen{

    public function __construct(){
        add_action( 'admin_menu', array( $this, 'doAddMenuPage' ) );
    }

    public function doAddMenuPage(){
        add_menu_page( "AdminScreen", "AdminScreen", 'edit_others_pages', 'AdminScreen', array($this, 'echoAdminPage') );
    }

    public function echoAdminPage(){        
        //Prints out the HTML into the output buffer:
        echo '<div class = "wrap"><h1 class = "wp-heading-inline">This looks good, finally!</h1></div>';
    }
}

- 0
- 2019-10-14
Ecco un altrointeressante articolo chefa un lavoro decente dielencaretutte le classi css disponibili/markup html che sipossono usarenello stile di unapagina di amministrazione.Gli articoli sono unpo 'obsoletiin quantomostrano risultati di stile dalla versioneprecedente di WordPress,quindi èprobabile che da allora siano state aggiunte classi aggiuntive.

Altre risorse utili sono le dashicon di WordPress.

Tuttavia,devo congratularmi con @ bueltge peril suoeccellente plugin elencato di seguito chefa un ottimo lavoronelmantenere un riferimento aggiornato degli stili di amministrazione.

Here is an other interesting article that makes a decent job of listing all the available css classes/html markup one can use in styling an admin page. The articles is a little outdated in that it show styling results from older version of WordPress, so its likely that additional classes have been added since.

Another useful resources are the WordPress dashicons.

However, I have to congratulate @bueltge on his excellent plugin listed below which does a great job of keeping an updated reference of admin styles.

helenhousandi · Accepted Answer · 2012-01-13

15

2012-01-13

Stiamo lavorandoper aggiornare http://dotorgstyleguide.wordpress.com/per averepiù di questeinformazionie riflettere lo stileaggiornamenti dalla 3.2.

Oltre a questo,ho visto unplugin (che almomentonon riesco atrovare) chemostra una sorta dipagina demo chemostrai vari selettori CSSe il loro aspetto,ma credo chefosse obsoleto.Oltre a questo,latuamigliore opzioneper orapotrebbeessere quella di avviare Firebug/Web Inspectore dare un'occhiata a wp-admin/css/wp-admin.dev.css.

grazie,ho usato la soluzionefirebug su alcunepiccole cose che hofattofino ad ora.Funzionabene mapreferisco qualcosa dipiù simile ai dueesempi dielenchi che ho ricevuto date e @bultge :)grazie!

thank you, i have used the firebug solution on some small things i have done until now. It works ok but Id prefer something more like the two list examples i got from you and @bultge :) thank you!
- 0
- 2012-01-13
- Ole Henrik Skogstrøm
Il contenuto di questo sito è ora abbastanza obsoleto.

The content on this site is now quite obsolete.
- 6
- 2018-08-02
- Burgi