Current status of the Ning Platform is always available on the Ning Status Blog.

NC for Hire

[3.0 MOD] Advance CSS Editor

Hello Creators,

Today, your troublesome css editing on your network will be forever be eliminated with my new mod- Advance CSS Editor

Why did I build this?

Well I was scratching my head out of frustration because Ning current's custom css editor is plain and small, I need something powerful and big to edit it. So I decided to make this to solve all the problems Ning designers are facing.

 

Powered by Ace Editor

I have chosen Ace Editor as the code editor for this mod, Ace Editor is one of the best code editors out there, Github also uses this.

Cost

Totally free as long as you do not remove my credits.

Features

CSS Syntax Highlighting - For easy and comfortable reference

Preview and Publish right on the module itself

Code blocks - Able to minimize or expands code blocks like you see in most code editors

Autocomplete - just to make sure you don't miss out any semicolons ;)

 

Usage

Just add the scripts below to your Custom Code -> Below box:

<link href="http://elsodev.com/projects/csseditor/style.css" rel="stylesheet" type="text/css">

<script type="text/javascript" src="http://elsodev.com/projects/csseditor/script.min.js"></script>
<script src="http://elsodev.com/projects/csseditor/ace-builds/src-min/ace.js" type="text/javascript" charset="utf-8"></script>

(P/S You can also add the stylesheet to the Head section of the custom code, but scripts must be in below code)

Launching the Editor

Just go to your Design Studio->Custom CSS->Launch Editor


Coming Soon Upgrades

* I will make the upgrades if creators support this modification and provide suggestions for improvements

1. Resizable module (adjust the width to your preference)

2. Change the opacity of the textbox

3. More advance CSS autocomplete by guessing the CSS properties(like most IDE)

4. Live preview (preview as you code)

5. Changeable themes and colors

If you like my work, do follow me on twitter for more cool stuff.

You need to be a member of Ning Creators Social Network to add comments!

Join Ning Creators Social Network

Votes: 0
Email me when people reply –

Replies

  • Wow, pretty neat.  Just tried it.  Made an adjustment, hit preview, liked it and hit Publish.  Done.  Very nice Elson; thank you!

  • Hello Elson Tan

    Thank you looks great  , I am unable to write code , but I can copy and paste. 

    • NC for Hire

      Hi,

      Did the editor launch normally? What browser are you viewing on?

  • NC for Hire

    thanks Elson... i'll give it a spin!  Nice work!

  • NC for Hire

    have you managed to figure out a way to make text editors in dashboard open to full screen, by chance?

    • NC for Hire

      Hi JFarrow,

      Unfortunately no since Ning does not allow script injection on dashboard, but I know a way around it, will work on it soon.

  • you do impressive work..tru genius

  • 1 issue

    it wont be an issue for many but for me it is

    i use  a css minifyer  so  most of my older codes all on 1 line

    the editor should be smart enough to break lines at } and seperate the code blocks regardless of how the codes written in the original

    • NC for Hire

      Oh, I will try if I can make minified css work on this.

This reply was deleted.
 

Some interesting articles related to community management, digital marketing etc. could be found in our digest. Don't hesitate to leave a feedback so we would know that we should continue :-)

Latest Activity

Kenny Craig updated their profile
yesterday
Isabella Wilson updated their profile
Thursday
Eva liked ⚡JFarrow⌁'s discussion What is going on with Ning? What Do We have to Look Forward To?
Jun 2
Eva liked Suave's discussion I AM LOOKING FOR DEVELOPER ASSISTANCE WITH ADDING AUTOMATIC MUSIC TO MY HOME PAGE
Jun 2
Alex - Rosas † Negras posted a discussion
Jun 1
Alex - Rosas † Negras posted a discussion
May 28
Alex - Rosas † Negras replied to Suave's discussion
I AM LOOKING FOR DEVELOPER ASSISTANCE WITH ADDING AUTOMATIC MUSIC TO MY HOME PAGE
"if you need I'm here, if you look in my discussions you will also find the playstil"
May 23
Alex - Rosas † Negras replied to ⚡JFarrow⌁'s discussion
What is going on with Ning? What Do We have to Look Forward To?
"Bizz ⚡JFarrow⌁ 
I'm sorry that many like us have worked so hard and given up, but at least I'm…"
May 23
⚡JFarrow⌁ posted a discussion
Back in the day, this community was jumping with activity.   But since the Ukraine war broke out we…
May 22
⚡JFarrow⌁ and Truebook are now friends
May 22
Alex - Rosas † Negras replied to Alex - Rosas † Negras's discussion
I want to thank JOHN BIZLEY ( BIZZ) for his invaluable help, active icons on the Ning bar,CODES ADDED
"A thousand thanks"
May 20
Alex - Rosas † Negras replied to Pam Givens's discussion
Landing Page
"Pam Givens this is an example i created of an old 3.0 site"
May 20
More…

Meanwhile, you can check our social media channels