• Home

  • How to add Syntaxhighlighter Ckeditor Button in Wordpress

Banner for Syntaxhighlighter Ckeditor Button
This plugin adds a code button for WordPress CKEditor which helps to type or edit tag for Alex Gorbatchev's SyntaxHighlighter. Wordpress Tutorial
Noted That:
  • To install correctly this syntaxhighlighter-ckeditor-button.zip .
  • Fisrt Download the syntaxhighlighter-ckeditor-button.zip to your computer
  • Extract/Open syntaxhighlighter-ckeditor-button.zip to Your Computer.
  • Then, Find readme.txt file inside syntaxhighlighter-ckeditor-button.zip and Open readme.txt .
  • Now, Read the Requirements of this plugin. Which Wordpress Version and PHP Version are required to run this Plugin in Your Wordpress Site.
  • Then, Follow the Tips Below.
Start the Tips:

Step-1 : Download " syntaxhighlighter-ckeditor-button.zip " to Your Local Computer.

Step-2 : Then, Login to your " yourdomain.com/wp-admin " Dashboard.

Login to Wordpress Syntaxhighlighter Ckeditor Button

Step-3 : Then, Click on " Plugins " + " Add New " from left Side Menu of Dashboard.

Go to Plugin Install Syntaxhighlighter Ckeditor Button

Step-4 : Now, Click on " Upload Plugin " button.

Click Upload Button Syntaxhighlighter Ckeditor Button

Step-5 : Now, Browse " syntaxhighlighter-ckeditor-button.zip " Downloaded plugin from your computer, Where you downloaded " syntaxhighlighter-ckeditor-button.zip " According to Step – 1 Above then, click on " Install Now "

Upload Plugin Syntaxhighlighter Ckeditor Button

Step-6 : Now, Click on " Active Plugin "

Activate Syntaxhighlighter Ckeditor Button

Step-7 : Then, See left Side Menu. " Syntaxhighlighter Ckeditor Button " folder is added on left Side Menu. Now, Click on " Syntaxhighlighter Ckeditor Button " folder.

Noted that: If you do not see " Syntaxhighlighter Ckeditor Button " folder on left Side Menu then, see at left Side Menu " Settings " or " Tools ".

Step-8 : Now you configure yourself oR Watch video tutorial below about Syntaxhighlighter Ckeditor Button Configurations and Settings or How to work " Syntaxhighlighter Ckeditor Button " in your WordPress site.

oR

After Activated Plugin According to Step-6 then,

  1. Go to " Plugins " + " Installed Plugin " from Wordpress Admin Panel Leftside Menu.
  2. or Direct go to: https://yourdomain/wp-admin/plugins.php
  3. Then, Find " SyntaxHighlighter CKEditor Button " Activated Plugin from Plugin List.
  4. Then, Click on " Settings " from Plugin that is SyntaxHighlighter CKEditor Button
  5. Now, Edit/Add/Config the setting and Click on " Save Changes " button,
WP Plugin Setting



Guide
  1. Upload this plugin to the ‘/wp-content/plugins/’ directory.
  2. Activate the plugin through the ‘Plugins’ menu in WordPress.
  3. Make sure you have installed and activated CKEditor For WordPress and Auto SyntaxHighlighter plugin.

  4. To give the pre tag a special style in the visual editor, go to “CKEditor-> Advanced Settings”, set “Editor CSS” to be Define css, set “CSS path” to be http://yourdomain.com/wp-content/plugins/syntaxhighlighter-ckeditor-button/ckeditor.css . Please replace yourdomain.com with the real path of your “WordPress Address” defined in “Setings-> General”.

  5. Save the settings and enjoy.

Note: If you encounter any problem after upgrading please clear your browser’s cache.

Name
   How to add Contact Form 7 Civicrm Integration in Wordpress
   How to add Dable in Wordpress
   How to add Block User Account in Wordpress
   How to add Gym Studio Membership Management in Wordpress
   How to add Mysqli in Wordpress