Skip to main content

Placing Code In Your Blogspot Post

Ever wanted to post code to your Blogspot account, but ran into a mess regarding how Blogspot interprets your code sample?  Well, the solution is pretty straightforward with a bit of tinkering.

First, you'll need to edit the HTML of your blog from the Design, Edit HTML tab in the administrative section of your Blogspot account.

What you will need to do is add a class to the style section in the header called .postCode which will look something like this:


.postCode{
 background:#FCFCFC none repeat scroll 0 0;
 border:1px inset #012BB2;
 height:150px;
 margin:10px;
 overflow:auto;
 padding:6px;
 text-align:left;
}

Then, whenever you right a new blog post, you need to make sure to select the Edit HTML tab next to the Compose button and put the following wrappers around the code:

<pre class="postCode"></pre>

Now, to actually get it to appear like that, you have to put your code through a bit of a translation by using this link to a Text -> HTML Entities page.

Basically, you paste the code you want to display into one box, then it converts it to what you need to paste between the above postCode wrapper.

Comments

Popular posts from this blog

How To Run Chrome From Within Notepad++

If you have recently tried to Run  Chrome from within Notepad++ recently, you've probably encountered the same issue I did.  Chrome didn't run. The fix is actually really simple.  Open up the Run box in Notepad++ and browse to your installation of Chrome. ie.  C:\Program Files\Google\Chrome\Application\Chrome.exe Select the file when you find it.  Now, the trick is: Put quotation marks around the path you see in the Run  box.  Now, put 1 space after the closing quotation mark. Type this: $(FULL_CURRENT_PATH) It'll look something like this: Click Run .  If Chrome opens, click Save and set your hotkey.

Developer Note: Virtuemart - Editing the Add to Cart MooTool Popup

To edit the “Add To Cart” popup that appears when you add an item to a cart in Virtuemart, there are few files that you need to know about. These are the files to know \components\com_virtuemart\themes\default\theme.js \components\com_virtuemart\js\mootools\   - contains the files for editing the appearance of the popup. To edit the appearance of the box, edit \components\com_virtuemart\js\mootools\mooPrompt.css to change the styles as well as editing the 2 images in the directory to edit how they appear as well (close box and header-background)

Divi Theme - Remove pause 'on hover' of the full width slider

In the Divi theme, open up /js/custom.js Comment out the following code (around line 144) if ( settings.slideshow && et_slides_number > 1 ) { $et_slider.hover( function() { $et_slider.addClass( 'et_slider_hovered' ); if ( typeof et_slider_timer != 'undefined' ) { clearInterval( et_slider_timer ); } }, function() { $et_slider.removeClass( 'et_slider_hovered' ); et_slider_auto_rotate(); } ); }