My Custom Styles

Description

An easy to use, with intuitive interface WordPress plugin that gives you the ability to easily and safely add your custom styles (CSS code) to WordPress website’s section, directly out of your WordPress Admin area, without any need of an external editor.

It’s purpose is to provide a familiar experience to WordPress users. No need anymore to editing a files of your theme and/or plugins for to add custom CSS code. Just add your CSS code in the field on the plugin settings page and this plugin will do the rest for you.

It’s really useful in case of any theme update, because your custom CSS code would never be overwritten. Your custom CSS code will keep on working, no matter how many times you upgrade or switch your theme.

On the plugin settings page you find the CSS editor powered by CodeMirror. It have syntax highlighting and line numbering options. Also this editor support a tab indentation. If you want more options then tell me and I will be happy to add it.

Features

  • Lightweight and fast
  • Secure code with using clear coding standards
  • Intuitive interface with many settings
  • Cross browser compatible (work smooth in any modern browser)
  • Compatible with all WordPress themes
  • RTL compatible (right to left)
  • Translation ready

Key features include…

  • Toggle for temporary disable the custom CSS code
  • Syntax highlighting (by CodeMirror)
  • Line numbering
  • Active line highlighting
  • Editor allow for tab indentation
  • And much, much more!

Coming soon:

  • Reload the settings page at same position after pushing the save button
  • Multisite network support

Translation

  • English (default)
  • Russian

If you would like to add a translation to this plugin then please head to our Translating WordPress page.

Consider Going Pro For Additional Features!

Pro Features

All features from Free version included plus:
* Unlimited number of snippets
* CSS minifier
* Automatic backup of all snippets to a file
* Toggle for temporary disable the certain snippets
* Button for collapse/expand the field with code
* Sidebar items can be collapsed or expanded
* Well documented

Get the PRO version now!
“My Custom Styles” is one of the personal software projects of Arthur Gareginyan.

License

This plugin is licensed under the GNU General Public License, version 3 (GPLv3) and is distributed free of charge.
Commercial licensing (e.g. for projects that can’t use an open-source license) is available upon request.

Credits

Links

Screenshots

  • Plugin page.
  • Plugin page with custom CSS code added.

Installation

Install “My Custom Styles” just as you would any other WordPress Plugin.

Automatically via WordPress Admin area:

  1. Log into Admin area of your WordPress website.
  2. Go to “Plugins” -> “Add New“.
  3. Find this plugin and click install.
  4. Activate this plugin through the “Plugins” tab.

Manually via FTP access:

  1. Download a copy (ZIP file) of this plugin from WordPress.org.
  2. Unzip the ZIP file.
  3. Upload the unzipped catalog to your website’s plugin directory (/wp-content/plugins/).
  4. Log into Admin area of your WordPress website.
  5. Activate this plugin through the “Plugins” tab.

After installation, a “Custom Styles” menu item will appear in the “Appearance” section. Click on this in order to view plugin administration page.

More help installing Plugins

FAQ

Installation Instructions

Install “My Custom Styles” just as you would any other WordPress Plugin.

Automatically via WordPress Admin area:

  1. Log into Admin area of your WordPress website.
  2. Go to “Plugins” -> “Add New“.
  3. Find this plugin and click install.
  4. Activate this plugin through the “Plugins” tab.

Manually via FTP access:

  1. Download a copy (ZIP file) of this plugin from WordPress.org.
  2. Unzip the ZIP file.
  3. Upload the unzipped catalog to your website’s plugin directory (/wp-content/plugins/).
  4. Log into Admin area of your WordPress website.
  5. Activate this plugin through the “Plugins” tab.

After installation, a “Custom Styles” menu item will appear in the “Appearance” section. Click on this in order to view plugin administration page.

More help installing Plugins

Q. Will this plugin work on my WordPress.COM website?

A. Sorry, this plugin is available for use only on self-hosted (WordPress.ORG) websites.

Q. Can I use this plugin on my language?

A. Yes. But If your language is not available then you can make one. This plugin is ready for translation. The .pot file is included and placed in the “languages” folder. Many of plugin users would be delighted if you shared your translation with the community. Just send the translation files (*.po, *.mo) to me at the arthurgareginyan@gmail.com and I will include the translation within the next plugin update.

Q. How does it work?

A. Simply go to the plugin settings page, add your CSS code to the field, switch the toggle to the “ON” position and click the “Save Changes” button. Enjoy the result of applying your CSS code. It’s that simple!
You can find the plugin settings page at “WP Admin Panel” -> “Appearance” -> “Custom Styles“.

Q. How much of CSS code (characters) I can enter in the text field?

A. I don’t limit the number of characters.

Q. Does this plugin requires any modification of the theme?

A. Absolutely not. This plugin is configurable entirely from the plugin settings page that you can find in the Admin Panel of your WordPress website.

Q. Does this require any knowledge of HTML or CSS?

A. This plugin can be configured with no knowledge of HTML or CSS, using an easy-to-use plugin settings page. But you need to know the HTML or CSS in order to add/remove/modify the HTML or CSS code by using this plugin.

Q. It’s not working. What could be wrong?

A. As with every plugin, it’s possible that things don’t work. The most common reason for this is a web browser’s cache. Every web browser stores a cache of the websites you visit (pages, images, and etc.) to reduce bandwidth usage and server load. This is called the browser’s cache.​ Clearing your browser’s cache may solve the problem.

It’s impossible to tell what could be wrong exactly, but if you post a support request in the plugin’s support forum on WordPress.org, I’d be happy to give it a look and try to help out. Please include as much information as possible, including a link to your website where the problem can be seen.

Q. The last WordPress update is preventing me from editing my website that is using this plugin. Why is this?

A. This plugin can not cause such problem. More likely, the problem are related to the settings of the website. It could just be a cache, so please try to clear your website’s cache (may be you using a caching plugin, or some web service such as the CloudFlare) and then the cache of your web browser. Also please try to re-login to the website, this too can help.

Q. Where to report bug if found?

A. Please visit the Dedicated Plugin Page on GitHub and report.

Q. Where to share any ideas or suggestions to make the plugin better?

A. Any suggestions are very welcome! Please send me an email to arthurgareginyan@gmail.com. Thank you!

Q. I love this plugin! Can I help somehow?

A. Yes, any financial contributions are welcome! Just visit my website, click on the donate button, and thank you!

Contributors & Developers

“My Custom Styles” is open source software. The following people have contributed to this plugin.

Contributors

Changelog

4.2

  • Compatibility with PHP version 5.2 improved.
  • PHP shorthands improved.
  • Added function for generating the plugin constants.
  • Some constants now get the value from the plugin header data.
  • The “_plugin_version_number” function improved.
  • Added file “upgrade.php” for future upgrades.

4.1.1

  • Fixed the bug due to which the “Warning: Constants may only evaluate to scalar values in” warning are displayed.

4.1

  • Added new constants: “_SLUG”, “_PREFIX”, “_SETTINGS” and “_NAME”.
  • Value of the “_VERSION” constant replaced with information from the plugin header data.
  • All references to the plugin name, slug, prefix are replaced with constants.
  • The “name” attribute removed from the “form” tag.
  • Code formatting improved.
  • F.A.Q. section updated.

4.0.1

  • Fixed the bug due to which the the “Warning: Illegal string offset ‘version’ in” and the “Warning: Illegal string offset ‘old_version’ in” warnings are displayed. (Thanks to Sven Brill)

4.0

  • The design of the plugin settings page is completely redone.
  • Added additional donate link to the “Plugins” page.
  • The ‘Using’ section renamed to ‘Usage’.
  • My Unicode signature added to the main file.
  • The donate button replaced with new.
  • The ‘Donate’ section renamed to ‘Support’.
  • The ‘donate.png’ image removed.
  • Options from the settings page moved to a separate file.
  • The “Usage” section removed from the sidebar area.
  • Additional “Support” section added.
  • Added tab navigation menu for the settings page.
  • Added additional tabs on the settings page.
  • Code of the ‘admin.css’ file improved and better commented.
  • A full version of the Bootstrap framework is integrated.
  • The ‘mcstyles_load_scripts’ function renamed to ‘mcstyles_load_scripts_admin’.
  • Added the CSS code for the custom list numbers on the plugin settings page.
  • The main font is changed to “Verdana”.
  • All PHP and HTML code is better formatted.
  • The header on the settings page of plugin is redesigned.
  • The “LICENSE.txt” file renamed to “license.txt”.
  • The “humans.txt” file added.
  • Messages from the plugin settings page moved to a separate file “messages.php”.
  • The “_service_info” setting added to the data-base.
  • Added function for managing information about the version number of the plugin.
  • Added the “Hello” message that show when the plugin is just installed.
  • Added the “Error” message that show when user is trying to degrade the version number of the plugin.
  • Fixed the parameter that contain the path to source files in all translation files.
  • The POT file updated.
  • Translations updated.

3.3

  • Added global constant for plugin text-domain.
  • Translations updated.
  • Readme for translations updated.
  • Link of banner image updated.

3.2

  • On the settings page changed an advertisement about the PRO version of this plugin.
  • The Readme.txt file improved.
  • Added the Readme.txt file for translation contribution.

3.1.1

  • Link to the premium version of plugin changed.
  • The Readme.txt file improved.

3.1

  • Added prefixes to the stylesheet and script names when using wp_enqueue_style() and wp_enqueue_script().
  • Added constant for storing the plugin version number.

3.0

  • The structure of files changed.
  • Style sheet of settings page improved and better commented.
  • JS code improved.
  • Donate text added.

2.3

  • Added a toggle for temporary disable the custom CSS code.
  • Added active-line.js add-on to CodeMirror editor.
  • Added function for stoping execution of user entered code if it empty.
  • Added function of automatic remove the “successful” message after 3 seconds.
  • Removed the default message about successful saving.
  • Color of editors border changed to #ddd.
  • Styles of settings page optimized for mobile devices.
  • The styles.css file better commented.
  • The _enqueue_codemirror_scripts function renamed to mcstyles_load_scripts.
  • The esc_textarea() removed from the preparing function of user entered code.

2.2

  • CodeMirror library updated to version 5.16.0.
  • File js-functions.js renamed to functions.js.
  • Added the ad about PRO version of this plugin.
  • Removed my personal ad about freelance.

2.1

  • Text domain changed to “my-custom-styles”.
  • Added compatibility with the translate.wordpress.org.
  • All images are moved to the directory “images”.
  • Image “btn_donateCC_LG.gif” is now located in the “images” directory.
  • Strict mode enabled in the file js-functions.js.

2.0

  • New design of settings page (new layout).
  • Constants variables added.
  • editor.js deleted.
  • js-functions.js (file with all js functions) created.
  • Plugin URI changed to GitHub repository.
  • Added my personal ad about freelance.
  • .pot file updated.
  • Russian translation updated.

1.7

  • Donate link changed.
  • Localization improved.
  • .pot file updated.

1.6

  • Authors URI changed.

1.5

  • Removed more unused do_action() from page.php file.

1.4

  • The stylesheet of plugin page moved to separate file.
  • The javascript from page.php moved to separate file.
  • Changed the style of title in plugin page.
  • The LICENSE file renamed to LICENSE.txt.
  • Fixed the prefix in name of function “mcstyles_add_styling”.

1.3

  • Fixed the issue due to which nothing appears below line 26 until you click below that line.

1.2

  • Combined and minified the CodeMirror scripts.
  • Deleted excess line: “delete_option( ‘mcstyles_error’ )”.

1.1

  • Added ready for translation (.pot file included).
  • Added russian translation.

1.0

  • Initial release.
  • Added syntax highlighting by CodeMirror.
  • Added line numbering by CodeMirror.

0.3

  • Release candidate.

0.2

  • Beta version.

0.1

  • Alfa version.