96Views6Replies

Author Options:

Source Code Window in Instructable Page Answered

Hi,

it's my first time to write an instructable. I wanna add a few lines of source code to demonstrate in a page. I saw many people has done that.I searched in google but couldn't find it. I think perhaps it should be something like HTML format.

Anyone could help? Thanks very much!

Jichun

Discussions

0
None
Downunder35m

1 year ago

That should work - if the editor does not mess it up:

"

Scrollbox: <textarea style="width: 600px; height: 300px;" rows="20" readonly="readonly" name="code" cols="75">Enter Code Here</textarea>

"
Without the quotes, replace Enter Code Here with your own code.
I gave up requesting these features from the editor :(

0
None
penguin007Downunder35m

Reply 1 year ago

Thanks very much. I tried your code, it looks like below in the first picture: black background no scrollbar on the right. But I would like the style in the second picture: white background and scrollbar on the right.

temp.jpgtemp2.jpg
0
None
Downunder35mpenguin007

Reply 1 year ago

Did you switch to the html mode of the editor and replace the Enter Code with some of your own code?
Not 100% sure it will work from the standard editor but if it does it should give you the look to the right.
Any difference when you try what Bravoechonovember suggested?

0
None
penguin007Downunder35m

Reply 1 year ago

Thanks, it works!

I added the html tag, then it works! The source code is below:

<html>
Scrollbox: <textarea style="width: 600px; height: 300px;" rows="20" readonly="readonly" name="code" cols="75">pPart = pidValue.proportionalValue * angleErrorNew;
iPart += pidValue.integralValue * angleErrorNew;
dPart = pidValue.derivativelValue * (angleErrorNew - angleErrorOld);</textarea>
</html>

Thanks a lot! Problem solved.