How to tweak the output [CODE] for blogs

Following the topic: [CODE] Pimp your posts [/CODE]

How to tweak the output of Notepad++

After you have successfully edited your language styles through the /settings/styler configurator/ menu, you can export your code in HTML format as shown below:
Export from Notepad++
Of course you need the NppExport plug-in installed with Notepad++

Now that you have the HTML format, you can't just copy/paste the entire page code into you blog, why?
Speaking of wordpress.com, it doesn't support customized CSS (unless you upgrade) or embedded style sheets inside your topics, NppExport plug-in uses CSS to customize the appearance of each keyword, thus, copy/paste won't simply work because the embedded CSS will be removed on saving.

How do we solve that?
Open the exported HTML file with Notepadd++ (or any other editor), you will notice scripts like:HTML format
See the CSS?
Scroll down and notice that each keyword is using it's own predefined span style through the embedded CSS.

Let's work for example on the includelib directive, it has a class name "sc9", so we go up and see that the style says:

.sc9 {
color: #800080;
background: #000000;
}

Now we replace the whole <span class="sc9"> line with this <span style="color:#800080;background:#000">, we use Find/Replace to Replace all the matching lines, we repeat the same thing to all other span tags.

After you are done you can now copy the code between <body> & </body> and post it on your blog, if you want to change the background of the code space you can do that by simply using another span tag that surrounds the entire tags and set the background-color to whatever you want.

If you have any questions don't hesitate, Enjoy another fine post🙂

5 Responses to “How to tweak the output [CODE] for blogs”

  1. Omar Eladel Says:

    veryyyyyyyyyyyyyyyyyyy gooooooooooooooooooooooooooooood
    thank u vry much😉
    that’s soo fine
    we must make thanks button in wordpress😉

  2. Try using CODE GOES HERE…

  3. are you being serious?

  4. That’s great man thanks🙂
    I missed the FAQs.. FAQ that!😛

    unfortunately they don’t support assembly😦
    too bad

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: