Display layout for [code] BBC in notepad++ style

Started by sangham.net, March 09, 2014, 09:40:45 AM

Previous topic - Next topic

sangham.net

Dear SMF Supporters and SMF Friends,

if one uses the [php] BBcode the "original php outlook will be adopted for display. Now may question is if it would be possible to adopt the notepad++ style for the [code] BBcode for display and if how?

Or how to make a [npcode] BBC?

Thanks for hints in advanced!

Suki

What exactly do you mean by "notepad++" style?

There are multiple color variants on notepad++, most of the time people change that to suit their unique needs.
Disclaimer: unless otherwise stated, all my posts are personal and does not represent any views or opinions held by Simple Machines.

Shambles

You can put php snippets into a [code] dump if you wish, which should format it as I think you want (as long as you preface the dump with the <?php directive)


<?php
// this is some php
$johannB "a code machine";
?>


Suki

Yeah, he knows that already, what hes asking is how to change the colors to match notepad++ style.
Disclaimer: unless otherwise stated, all my posts are personal and does not represent any views or opinions held by Simple Machines.

Shambles

Hmm.. I didn't read it that way, as he doesn't mention colours anywhere, only "style".

Suki

Hes talking about this bbc tag:  [php][/php]

Which does the same you posted:


<?php
// this is some php
$johannB "a code machine";
?>
 


The only style there is the colors. Notepad has different "styles" all of them only change the colors.
Disclaimer: unless otherwise stated, all my posts are personal and does not represent any views or opinions held by Simple Machines.

sangham.net

Thanks a lot for your interest and requests, Suki and Shambles.

Yes Suki is right, although it's not so much only a color question. If you would put html I into the php BBC code, it would not match the right places to structure the colors as its code structure is different. Maybe its necessary (I am not sure if it is possible to adopt the whole notpad sytem) to reduce it to html codes in particular.

For example:

Quote
	
	
<
div id="whatsnew">
	
	
<
h4><a id="top">Heartily</awelcome on "Zugang zur Einsicht"</h4>
	
	
<
div style="text-align: justify"><p>Zugang zur Einsicht (shortZzEis a multilingual "mirror" page of <a href="http://accesstoinsight.org" target="offsite" class="offsite">accesstoinsight.org</a> and has the 
	
	
purpose to make the teachings of the Buddha and the early Buddhist Tradition accessable in more languagesMany articles of the origin website are already  
	
	
translated into German and other languages and may find here a place of collection for a good accessMore about the origin of <em>Zugang zur Einsicht</emyou may find in <a href="./zze-segen_en.html"><em>Introduction and Blessing</em></a>.
	
	
This page is based on the offlineversion of ATI March 2013 and is currently under construction (the english content is allready full avaliable). 
	
	
We are pleased with every kind of co-work and support and you may find some ideas how you could get involved with the fruitfull prospery of this undertaking 
	
	
here: <class="zzelink" href="./cowork_en.html" target="zzelink" title="Report a mistake, participate, support... You are heartily invited to join! See for more Infomations.">Collaboration</a


It would not discriminate on the right place. The specific color is not so important, even trough I think that the standard color system if quite enough.

I guess there is any script behind the "phpstyle" class which organizes the new "span" sections. I could not figure out even a little how it works and how to touch it.

Of course it would be useful to limit it into a "frame" like the code BBC, as it could be much text and easier to copy. I hope I do not raise to much dream, since I would be not able to give much back.


Quote<!--google verification entfernt -->
<
meta http-equiv="content-type" content="text/html; charset=utf-8" />
<
meta http-equiv="content-style-type" content="text/css" />
<!--
rss Pfad entfernt -->
<
link rel="stylesheet" type="text/css" href="./css/screen.css"  />
<
link rel="shortcut icon" href="./favicon.ico" type="image/x-icon" />
<!--
Opensearch entfernt -->
<
script src="./js/sfHover.js" type="text/javascript" language="javascript" charset="utf-8"></script>

<
script  type="text/javascript">
//<![CDATA[

function showHide(link) {

var 
article link.previousSibling;
while (
article.nodeName!='DIV') {// find the previous article
article article.previousSibling;
}
if (
article.className=='showall') {
link.innerHTML '<img src="http://zugangzureinsicht.org/html/img/more.png" alt="[show more]" />   [more]' ;
article.className='showmore' ;
}else{
link.innerHTML '<img src="http://zugangzureinsicht.org/html/img/hide.png" alt="[hide]" />   [hide]' ;
article.className='showall' ;
}
}

//]]>
</script>
</
head>
<
body>
<
div id="H_container">
<
div id="H_billboardHome">

<!-- /
Spachlink on-->
<
div id="F_langSymbol_de">
	
	
<
a href="index.html" title="Zur Deutschen Übersetzung"> </a><!-- /Spachlink -->
</
div><!-- /Spachlink end-->


<!-- 
loading search engine -->
<
div id="H_search">
<
form action="http://www.zugangzureinsicht.org/seek/search_en.php" method="get"><input type="text" name="query" id="query" size="30" value=""  />
<
input type="submit" value="Search" /><input type="hidden" name="search" value="1" /></form>

</
div>
	
<
div class="mainsail">
	
<
img src="img/banner3.gif" height="118" width="450" alt="Access to Insight: Readings in Theravada Buddhism" usemap="#popup" />
<
map name="popup" id="popup">
  <
area shape="rect" coords="0,0,150,40" href="randomsutta_en.html" title="Click here to get a random Sutta..." alt="" />
  <
area shape="rect" coords="0,41,150,80" href="randomarticle_en.html" title="Click here to get a random article..." alt="" />
  <
area shape="rect" coords="0,81,150,118" href="randomjataka_en.html" title="Click here to get a random Jataka..." alt="" />
</
map>
	

	
</
div>
	
<
div class="jib">
	
	
<
div class="dhp">
	
	
	
The non-doing of any evil,<br />
	
	
	
the performance of what's skillful,<br />
	
	
	
the cleansing of one'
s own mind: <br />
	
	
	
&
nbsp;&nbsp;&nbspthis is the teaching<br />
	
	
	
&
nbsp;&nbsp;&nbspof the Awakened. <a href="tipitaka/kn/dhp/dhp.14.than_en.html#dhp-183">&bull;</a>
	
	
</
div>


Attached a screenshot how the first code section would appear in notepad. When there are even script codes in between the colors are no more much useable to identify certain areas, using the php code.

So one thing is the discrimination part and the other is the style part.


Suki

The issue here is that you want to apply a PHP parser to HTML code, PHP, by definition, only applies the style to PHP code, if you put HTML code, PHP will render it as PHP so what you actually are seeing is how the parser thinks this HTML code will look like with the PHP syntax.

I remember there was a mod for colorizing other coding languages, HYML included, I can't remember the name though, it uses JavaScript to parse the code, identify the language and display it.

Try one of this mods:

http://custom.simplemachines.org/mods/index.php?mod=3070

http://custom.simplemachines.org/mods/index.php?mod=2925

I suppose yu could modify their css to match your notepad++ style.
Disclaimer: unless otherwise stated, all my posts are personal and does not represent any views or opinions held by Simple Machines.

sangham.net

Quote from: Suki on March 10, 2014, 12:15:47 PM
The issue here is that you want to apply a PHP parser to HTML code, PHP, by definition, only applies the style to PHP code, if you put HTML code, PHP will render it as PHP so what you actually are seeing is how the parser thinks this HTML code will look like with the PHP syntax.
Thanks for your hints, yes I am aware of it.
Quote from: Suki on March 10, 2014, 12:15:47 PMI remember there was a mod for colorizing other coding languages, HYML included, I can't remember the name though, it uses JavaScript to parse the code, identify the language and display it.

Try one of this mods:

http://custom.simplemachines.org/mods/index.php?mod=3070

http://custom.simplemachines.org/mods/index.php?mod=2925

Thanks a lot for your hints, I will work trough it.


Quote from: Suki on March 10, 2014, 12:15:47 PMI suppose yu could modify their css to match your notepad++ style.
No idea where I find the css styling file for it. It is not included in the index.css. So I don't know/understand the structure of this processes at all. If I understand the php code processes a little, than I might understand what is needed.

Suki

Depending on what mod you installed, it would be better to ask the mod author about it.
Disclaimer: unless otherwise stated, all my posts are personal and does not represent any views or opinions held by Simple Machines.

sangham.net

Thanks Suki,

the second you posted looks very much like that what I "dreamed" of.  I will try to use it. Since I made some changes for code outlook (just frame stuff) my self before, I am not sure it that would be a problem when installing.

I will work through it.


sangham.net

The mode you suggested Suki, works well, all trough I could not get trough the style coding to get it more notepad++ and to discriminate the text, especially, form codes.

The mod it self seems to have no more supporter active in this forum.

How ever, thanks a lot and more that grateful I guess it is good to make the topic solved.


Advertisement: