GithubHelp home page GithubHelp logo

bueltge / wordpress-admin-style Goto Github PK

View Code? Open in Web Editor NEW
952.0 57.0 124.0 4.49 MB

This plugin reference elements from wp-admin in an overview with the necessary markup and CSS classes to help you to develop WordPress compliant.

Home Page: http://wpengineer.com/2226/new-plugin-to-style-your-plugin-on-wordpress-admin-with-default-styles/

License: GNU General Public License v2.0

CSS 40.45% PHP 55.48% JavaScript 3.87% Hack 0.20%
wordpress genericons dashicons layout styleguide design-patterns wordpress-mp6

wordpress-admin-style's People

Contributors

brasofilo avatar bueltge avatar fossabot avatar glueckpress avatar jbradach avatar jeffrey-hearn avatar julien731 avatar lriaudel avatar ocean90 avatar pierrelebedel avatar stefanpejcic avatar talater avatar tivnet avatar wormeyman avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

wordpress-admin-style's Issues

Escaping using esc_attr_e()

Hi Frank, started using your plugin which is great, really helpful.

Question for you on internalization and strings, I noticed in a lot of examples like below...

<p><?php esc_attr_e('WordPress started in 2003 with a single bit of code to enhance the typography of everyday writing and with fewer users than you can count on your fingers and toes. Since then it has grown to be the largest self-hosted blogging tool in the world, used on millions of sites and seen by tens of millions of people every day.','wp_admin_style'); ?></p>

that text or headings are ecaped with esc_attr_e - I thought that this was really for attribute use and _e for regular text - or does it not matter?

Missing tips

Hello,

I submit to you 3 missing tips :

For the 2 columns layout :

<div class="handlediv" title="Click to toggle"><br></div>

For toogle the block.

An other 2 column type in category :

<div id="col-container">
    <div id="col-right">
        <div class="col-wrap"></div>
    </div><!-- /col-right -->
    <div id="col-left">
        <div class="col-wrap"></div>
</div><!-- /col-left -->
</div>

To the place of
:

<div class="clear"></div>

Bye

jQuery features not working

The features under Admin Style > jQuery UI are not working.

Bildschirmfoto 2021-08-30 um 11 11 41

I already fixed a warning for HTTPS sites caused by

'http://ajax.googleapis.com/ajax/libs/jqueryui/' . $wp_scripts->registered['jquery-ui-core']->ver . '/themes/smoothness/jquery-ui.css'

But that didnโ€™t help. There is no further warning I see and could experiment with.

Updation to 4.*

The repo hasn't been updated from some time to incorporate changes from 4.* onwards. Is Some one working on that?

[Feature Request]: Ability to change the colors

Is your feature request related to a problem?

I cannot change colors via the plugin UI

Describe the desired solution

Ability to change the colors via the UI

Describe the alternatives that you have considered

writing my own plugin

Additional context

not sure if this is already possible

Code of Conduct

  • I agree to follow this project's Code of Conduct

WordPress Built In Dialog Box For My Plugin

I want to using wordpress defaults model box in post edit page

[wp-admin/post.php?post=368&action=edit]

Model I wanted : Model I wanted

i tried the following instruction in https://codex.wordpress.org/Javascript_Reference/ThickBox

http://i.stack.imgur.com/nGlNK.png

Code I Entered

This is my hidden content! It will appear in ThickBox when the link is clicked.

I want to control my model with javascript and also needed tab view in that model like

[Media Model ]

Kindly help me to get this done

N/A

disregard

Gutenberg

It is necessary to add style guides for the Gutenberg project?

The admin tab of the plugin does not change tabs

This is the code:

<h2><?php esc_attr_e( 'Tabs', 'WpAdminStyle' ); ?></h2>
<h2 class="nav-tab-wrapper">
	<a href="#" class="nav-tab">Tab #1</a>
	<a href="#" class="nav-tab nav-tab-active">Tab #2</a>
	<a href="#" class="nav-tab">Tab #3</a>
</h2>

When I click on any of the tabs, it sends me to the top of the page.

How to make collapsible meta boxes

Hi
First, awesome project! I'm developing my first plugin for Wordpress 4.9 and this project is really useful.
I'm trying to use meta boxes for settings sections but it does not collapse.

Code for jQuery demo

Hello,
It is possible to have the code (css and js) to implemante for have all tools list in the page ?

2 Columns Layout: static (px)

In the 2 Columns Layout: static (px) section, it seems that the handle div markup has been changed to a button ( not sure in which version )

Old markup :
<div title="Click to toggle" class="handlediv"><br></div>

New markup :

	<button type="button" class="handlediv" aria-expanded="true" >
	<span class="screen-reader-text">Toggle panel</span>
	<span class="toggle-indicator" aria-hidden="true"></span>
	</button>

the current version of the plugin does not display the toggle button .

Add Color Picker Example

add_action( 'admin_enqueue_scripts', 'mw_enqueue_color_picker' );
function mw_enqueue_color_picker( $hook_suffix ) {
    // first check that $hook_suffix is appropriate for your admin page
    wp_enqueue_style( 'wp-color-picker' );
    wp_enqueue_script( 'my-script-handle', plugins_url('my-script.js', __FILE__ ), array( 'wp-color-picker' ), false, true );
}
<input type="text" value="#bada55" class="my-color-field" data-default-color="#effeff" />
jQuery(document).ready(function($){
    $('.my-color-field').wpColorPicker();
});

Since WP 3.5
https://make.wordpress.org/core/2012/11/30/new-color-picker-in-wp-3-5/

Contributing for new WordPress CSS features

I have looked into WordPress code that many CSS classes and features was added (CSS3, animations, etc) and the project is missing them.

I want to contribute but the contribution instructions aren't very clear. Can you tell me what i need to do? An fork and pull request will be fine?

Update readme

  • Lots of to old links to helping plugins.
  • Remove the hint for discussion, the post is old and closed and the currently area of this plugin is this repo, not more.
  • Also I should remove the donation topic, not relevant and to seldom with a result.

New element

I find a new element in: wp-admin/tools.php

<div class="card">
	<h2 class="title">Categories and Tags Converter</h2>
	<p>	If you want to convert your categories to tags (or vice versa), use the <a href="import.php">Categories and Tags Converter</a> available from the Import screen.</p>
</div>

json notice in admin

Notice: Failed to parse plugin metadata. Try validating your .json file with http://jsonlint.com/ in /public_html/wp-content/plugins/WordPress-Admin-Style-master/inc/plugin-updates/plugin-update-checker.php on line 657

WP 3.9.1a, installed plugin from github zip download.

Clarify admin-notices

Clarify how, when and where admin notices are moved.

The wrap class is important and since WordPress 4.3 the notices are moved after the first h1 or h2 (whichever comes first).

There is also the possibility of keeping a notice inline.

Two Column Markup, sidebar H3 element outside postbox DIV

Hey Frank...

The copy and paste markup for the two column layout needs a slight adjustment, currently the sidebar has no H3 element styling for its background. Snippet shown below with accompanying screenshot.

https://github.com/bueltge/WordPress-Admin-Style/blob/master/wp-admin-style.php#L286

The following markup;

            <div class="meta-box-sortables">
                <h3><span>Sidebar Content Header</span></h3>
                <div class="postbox">
                    Content space
                </div> <!-- .postbox -->
            </div> <!-- .meta-box-sortables -->

...produces:
whoops

Where as;

            <div class="meta-box-sortables">
                <div class="postbox">
                    <h3><span>Sidebar Content Header</span></h3>
                    Content space
                </div> <!-- .postbox -->
            </div> <!-- .meta-box-sortables -->

...produces:
better

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.