Mostrar mensagens com a etiqueta Blog. Mostrar todas as mensagens
Mostrar mensagens com a etiqueta Blog. Mostrar todas as mensagens

Embed Code Syntax in your posts

Steps to Add it to Blogger:
To highlight your code you just need to follow this steps:

1. You need to login to you account;

2.After that, go the Blogger Dashboard ->Design->Edit HTML.

The first step is making a backup of your current theme;





3. Now you need to copy the fowling code, and this is importing, copy it to Above/Before tag.


 <link href='http://alexgorbatchev.com.s3.amazonaws.com/pub/sh/current/styles/shCore.css' rel='stylesheet' type='text/css'/>
 <link href='http://alexgorbatchev.com.s3.amazonaws.com/pub/sh/current/styles/shThemeDefault.css' rel='stylesheet' type='text/css'/>
 <script src='http://alexgorbatchev.com.s3.amazonaws.com/pub/sh/current/scripts/shCore.js' type='text/javascript'/> 
 <script src='http://alexgorbatchev.com.s3.amazonaws.com/pub/sh/current/scripts/shBrushXml.js' type='text/javascript'/>
 <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushBash.js' type='text/javascript'/>
 <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCpp.js' type='text/javascript'/>
 <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCSharp.js' type='text/javascript'/>
 <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCss.js' type='text/javascript'/>
 <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJava.js' type='text/javascript'/>
 <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJScript.js' type='text/javascript'/>
 <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPhp.js' type='text/javascript'/>
 <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPython.js' type='text/javascript'/>
 <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushRuby.js' type='text/javascript'/>
 <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushSql.js' type='text/javascript'/>
 <script src='http://alexgorbatchev.com/pub/sh/sh/current/scripts/shBrushVb.js' type='text/javascript'/>
 <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPerl.js' type='text/javascript'/>

4. Now we nee to include this scripts, copy this code to Above/Before the tag.

 <script language='javascript'>
 SyntaxHighlighter.config.bloggerMode = true;
 SyntaxHighlighter.config.clipboardSwf = &#39;http://alexgorbatchev.com/pub/sh/current/scripts/clipboard.swf&#39;;
 SyntaxHighlighter.all();
 </script>

5. When you need to insert code, you just need to insert this tag, and paste it inside the tag:

 <pre class="brush: BRUSH-NAME">
  
 Paste Your Code Here
  
 </pre>


The "BRUSH-NAME" needs to be changes, so when your code is from a certain type, just change it to the right tag. For example, if is a xml code, change it to "BRUSH-NAME" with xml. All the code should be Escaped (Visit this Page to make your Code Escaped)

Note that there are a lot of different brush types that you can use:
• actionscript3, as3
• bash, shell
• c#, c-sharp, csharp
• coldfusion, cf
• cpp, c
• css
• delphi, pascal, pas
• diff, patch
• erl, erlang
• groovy
• java
• perl
• php
• plain
• powershell
• python
• ruby
• scala
• sql
• vb
• xml, html
The source list can be found at http://alexgorbatchev.com/pub/sh/



This is some features you can do:

This Line is Highlighted
This Line is not Highlighted
This Line is again Highlighted

You can hide the toolbar, if you want:

  
 If You observe ,there is no Toolbar
  
 

Read More... Embed Code Syntax in your posts

The truth about working in the IT industry

The truth about working in the IT industry

1. We work weird (night) shifts…
Just like prostitutes.

2. They pay you to make the client happy…
Just like a prostitute.

3. The client pays a lot of money, but your employer keeps almost every penny…
Just like a prostitute.

4. You are rewarded for fulfilling the client's dreams…
Just like a prostitute.

5. Your friends fall apart and you end up hanging out with people in the same profession as you…
Just like a prostitute.

6. When you have to meet the client you always have to be perfectly groomed…
Just like a prostitute.

7. But when you go back home it seems like you are coming back from hell…
Just like a prostitute.

8. The client always wants to pay less but expects incredible things from you…
Just like a prostitute.

9. When people ask you about your job, you have difficulties to explain it…
Just like a prostitute.

10. Everyday when you wake up, you say: "I'm not going to spent the rest of my life doing this."
Just like a prostitute................
....
Read More... The truth about working in the IT industry

Cool bookmarks to share your posts

About some days ago I am walking around the web and i want a widget to share your post and find this one, so i was looking over the web a find a good tutorial about adding social bookmarks. I find several pages, but some don't explained very well or don't work. So i found the the i refereed in the source, that helps to insert this widget into your blogger. Here is a screenshot of the widget i am talk about.
What the end you have i imagem that contained, more phrases, but to change, you must edit the image.
Now, I will try to explain how to add this in the blogger.


GENERAL

Sign in to Blogger, and go to LAYOUT -- Edit HTML -- (checked expand widget templates)



Find (CTRL+F) this code:

]]></b:skin>


Afterwards, Add this CSS composition below ]]></b:skin>


<style type='text/css'>
div.sexy-bookmarks {
height:54px;
background:url('http://YOUR-IMAGE-HOSTING/sharingsexy.png') no-repeat left bottom;
position:relative;
width:540px;
}

div.sexy-bookmarks span.sexy-rightside {
width:17px;
height:54px;
background:url('http://YOUR-IMAGE-HOSTING/sharingsexy.png') no-repeat right bottom;
position:absolute;
right:-17px;
}

div.sexy-bookmarks ul.socials {
margin:0 !important;
padding:0 !important;
position:absolute;
bottom:0;
left:10px;
}

div.sexy-bookmarks ul.socials li {
display:inline-block !important;
float:left !important;
list-style-type:none !important;
margin:0 !important;
height:29px !important;
width:48px !important;
cursor:pointer !important;
padding:0 !important;
}

div.sexy-bookmarks ul.socials a {
display:block !important;
width:48px !important;
height:29px !important;
font-size:0 !important;
color:transparent !important;

}

.sexy-furl, .sexy-furl:hover, .sexy-digg, .sexy-digg:hover, .sexy-reddit, .sexy-reddit:hover, .sexy-stumble, .sexy-stumble:hover, .sexy-delicious, .sexy-delicious:hover, .sexy-yahoo, .sexy-yahoo:hover, .sexy-blinklist, .sexy-blinklist:hover, .sexy-technorati, .sexy-technorati:hover, .sexy-facebook, .sexy-facebook:hover, .sexy-twitter, .sexy-twitter:hover, .sexy-myspace, .sexy-myspace:hover, .sexy-mixx, .sexy-mixx:hover, .sexy-script-style, .sexy-script-style:hover, .sexy-designfloat, .sexy-designfloat:hover, .sexy-syndicate, .sexy-syndicate:hover, .sexy-email, .sexy-email:hover {
background:url('http://YOUR-IMAGE-HOSTING/sexysprite.png') no-repeat !important;
}

.sexy-furl {
background-position:-300px top !important;
}
.sexy-furl:hover {
background-position:-300px bottom !important;
}
.sexy-digg {
background-position:-500px top !important;
}
.sexy-digg:hover {
background-position:-500px bottom !important;
}
.sexy-reddit {
background-position:-100px top !important;
}
.sexy-reddit:hover {
background-position:-100px bottom !important;
}
.sexy-stumble {
background-position:-50px top !important;
}
.sexy-stumble:hover {
background-position:-50px bottom !important;
}
.sexy-delicious {
background-position:left top !important;
}
.sexy-delicious:hover {
background-position:left bottom !important;
}
.sexy-yahoo {
background-position:-650px top !important;
}
.sexy-yahoo:hover {
background-position:-650px bottom !important;
}
.sexy-blinklist {
background-position:-600px top !important;
}
.sexy-blinklist:hover {
background-position:-600px bottom !important;
}
.sexy-technorati {
background-position:-700px top !important;
}
.sexy-technorati:hover {
background-position:-700px bottom !important;
}
.sexy-myspace {
background-position:-200px top !important;
}
.sexy-myspace:hover {
background-position:-200px bottom !important;
}
.sexy-twitter {
background-position:-350px top !important;
}
.sexy-twitter:hover {
background-position:-350px bottom !important;
}
.sexy-facebook {
background-position:-450px top !important;
}
.sexy-facebook:hover {
background-position:-450px bottom !important;
}
.sexy-mixx {
background-position:-250px top !important;
}
.sexy-mixx:hover {
background-position:-250px bottom !important;
}
.sexy-script-style {
background-position:-400px top !important;
}
.sexy-script-style:hover {
background-position:-400px bottom !important;
}
.sexy-designfloat {
background-position:-550px top !important;
}
.sexy-designfloat:hover {
background-position:-550px bottom !important;
}
.sexy-syndicate {
background-position:-150px top !important;
}
.sexy-syndicate:hover {
background-position:-150px bottom !important;
}
.sexy-email {
background-position:-753px top !important;
}
.sexy-email:hover {
background-position:-753px bottom !important;
}

</style>



Part one is done.

Part TWO : Put in the HTML code

After we insert the CSS, please find this code:
<data:post.body/>


Then, copy paste this HTML composition below <data:post.body/>

<div class='sexy-bookmarks'>
<ul class='socials'>
<li class='sexy-delicious'><a expr:href='&quot;http://del.icio.us/post?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>

<li class='sexy-digg'><a expr:href='&quot; http://digg.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>

<li class='sexy-technorati'><a expr:href='&quot; http://technorati.com/faves?add=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>

<li class='sexy-reddit'><a expr:href='&quot; http://www.reddit.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>

<li class='sexy-stumble'><a expr:href='&quot; http://www.stumbleupon.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>

<li class='sexy-designfloat'><a expr:href='&quot;http://www.designfloat.com/submit.php?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>

<li class='sexy-facebook'><a expr:href='&quot; http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>

<li class='sexy-twitter'><a expr:href='&quot; http://twitthis.com/twit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>

<li class='sexy-furl'><a expr:href='&quot; http://www.furl.net/storeIt.jsp?u=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>

<li class='sexy-syndicate'><a href='http://feeds2.feedburner.com/YOUR-FEEDBURNER-ID' title='Subscribe to RSS'/></li>

<li class='sexy-email'><a expr:href='&quot; mailto:?subject=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>

</ul>
<span class='sexy-rightside'/></div>



Please see the blue link text. You may need to edit it with your own links

After that, save your template, and its done.



Notes:
Q:Why the images dont appear?

A:Maybe the host image has been exceed, so Download it and save it imageshack for example.




Here you have some images, to change that phrase. You just have to edit the image.


Source: http://www.cahayabiru.com/2009/04/add-sexy-social-bookmark-to-your.html
Read More... Cool bookmarks to share your posts

Automatic Read More for your blog

This tutorial will help you to insert in your blog a automatic read more.

We have to choose the number of characters after which the post will be truncated. If we choose 400, only show the first 400 characters.

Here we go:

STEP 1:
Log in to Blogger, and go to Layout->Edit Html and mark the Expand widget templates Box.


Now find (you can use Ctrl+F, to search it faster) this template code:
</head>


And insert before that code, the next code:


<script type='text/javascript'>var thumbnail_mode = &quot;no-float&quot; ;
summary_noimg = 500;
summary_img = 450;
img_thumb_height = 100;
img_thumb_width = 120;
</script>
<script src='http://files.main.bloggerstop.net/uploads/3/0/2/5/3025338/read-more_auto2.js' type='text/javascript'/>

You can change the items in blue. If your post dont have a image, then it will show 500 characters.


STEP 2:
Now we have to find this code
<data:post.body/>


And replace it, with this code:

<b:if cond='data:blog.pageType == "item"'>
    <data:post.body/>
<b:else/>
    <b:if cond='data:blog.pageType == "static_page"'>
        <data:post.body/>
    <b:else/>
            <div expr:id='"summary" + data:post.id'>
                <data:post.body/>
            </div>
            <script type='text/javascript'>
                createSummaryAndThumb("summary<data:post.id/>");
            </script>
            <div style='clear: both;'/>
            <span class='rmlink' style='float:right;padding-top:20px;'>
                <a expr:href='data:post.url'> Read More... <data:post.title/> </a>
            </span>
    </b:if>
</b:if>






Now save the template, and enjoy your read more.


Note: How you can see, the JS file, is in that location, but i suggest you, to download and save it somewhere else, because we never now.


Upload the file to :
I recommend this one MyDataNest

NOTE: You must set your folder as 'Hidden' and not 'Private', and after that is copy and link and paste it in your code.



Source: http://bloggerstop.net/2009/05/automatic-read-more-hack-for-blogger.html



Read More... Automatic Read More for your blog