Skip to content

Instantly share code, notes, and snippets.

View yumesh's full-sized avatar

Umesh Yellaboina yumesh

View GitHub Profile
@yumesh
yumesh / Installation of '+Follow' Floating-Slide Button on Blogger (Tutorial)
Created September 15, 2016 17:12
<style scoped='' type="text/css">
/*<![CDATA[*/
#arlinafollowSubscribe{background-color:#e74c3c;width:220px;color:#fff;position:fixed;z-index:999;right:10px;bottom:0}
.arlinafollowButton{background:#e74c3c;color:#fff;font-size:13px;line-height:28px;padding:0 10px;text-decoration:none;position:absolute;top:-28px;right:0;display:block;border-radius:2px 2px 0 0;height:28px;font-weight:700}
.arlinafollowButton span{background:url("https://4.bp.blogspot.com/-fc3-0J--iW8/VyPNjRmxJtI/AAAAAAAAD7U/emRRY6ntYEg3IaL-mev9XxE9M1OKh50fACLcB/s1600/follow-blogger.png") no-repeat scroll 0 3px transparent;padding-left:15px}
.arlinafollowButton:hover,.arlinafollowButton:focus,.followActive,.followActive:hover{color:#fff}
.arlinafollowButton:hover span,.followActive span{background-position:0 -37px!important}
.followactive{background-color:#333}
.arlinafollowForm{padding:15px;margin:auto;text-align:center;font-size:12px}
@yumesh
yumesh / Step:1 Java Script (1)
Created September 15, 2016 17:53
Specific Marking For a Label On The Tag post Using Conditional Tag (Lambda Expression)
<b:if cond="data:blog.pageType != &quot;item&quot;">
<b:if cond="data:blog.pageType != &quot;static_page&quot;">
<script type="text/javascript">
//<![CDATA[
//Post Label
function label_pilihan(e){labelku=new Array,labelku[1]="<div class='badge badge1'>
<div class='badge-img'>
<i class='fa fa-star'></i></div>
</div>
",labelku[2]="<div class='badge badge2'>
@yumesh
yumesh / Step:2 Java Script
Last active September 15, 2016 18:24
Specific Marking For a Label On The Tag post Using Conditional Tag (Lambda Expression)
<b:loop values='data:post.labels' var='label'>
<script type='text/javascript'>label_pilihan(&quot;<data:label.name/>&quot;);</script>
</b:loop>
@yumesh
yumesh / Step:2 HTML (1)
Last active September 15, 2016 18:24
Specific Marking For a Label On The Tag post Using Conditional Tag (Lambda Expression)
<b:includable id='post' var='post'>...</b:includable>
@yumesh
yumesh / Step:2 HTML (2)
Last active September 15, 2016 18:24
Specific Marking For a Label On The Tag post Using Conditional Tag (Lambda Expression)
<b:includable id='main' var='top'>...</b:includable>
@yumesh
yumesh / Step:3 CSS
Last active September 15, 2016 18:23
Specific Marking For a Label On The Tag post Using Conditional Tag (Lambda Expression)
/* Post Label */
.badge{background:#95a5a6;color:#fff;position:absolute;font-weight:normal;line-height:1;bottom:0;right:0;left:0;display:block;text-align:center;width:100%;height:50px;line-height:50px;font-size:18px;z-index:1;transition:all .3s}
.badge1{background:#e89c0f;opacity:.98}
.badge2{background:#40d47e;opacity:.98}
.badge3{background:#3498db;opacity:.98}
.badge4{background:#1abc9c;opacity:.98}
.badge5{background:#95a5a6;opacity:.98}
.post:hover .badge{color:rgba(255,255,255,.6);font-size:44px;height:100%;line-height:100%}
.post:hover .badge-img{margin:85px 0 0 0}
@yumesh
yumesh / Step:1 HTML - (Syntax Highlighter)
Created September 17, 2016 13:53
How to Implement Syntax Highlighter in Blogger or Blogspot Post.
/* CSS Prism Syntax Highlighter */
pre {
padding: 50px 10px 10px 10px;
margin: .5em 0;
white-space: pre;
word-wrap: break-word;
overflow: auto;
background-color: #2c323c;
position: relative;
border-radius: 4px;
@yumesh
yumesh / Step:2 Java Script (Syntax Highlighter)
Created September 17, 2016 13:59
How to implement Syntax Highlighter in Blogger or Blogspot.
<script src='https://arlina-design.googlecode.com/svn/prism.js' type='text/javascript'/>
@yumesh
yumesh / Step:2 J-query (Syntax Highlighter)
Created September 17, 2016 14:02
How to Implement Syntax Highlighter in Blogger or Blogspot Post.
<script>
$('pre').attr('class', 'line-numbers');
Prism.hooks.add("after-highlight",function(e){var t=e.element.parentNode;if(!t||!/pre/i.test(t.nodeName)||t.className.indexOf("line-numbers")===-1){return}var n=1+e.code.split("\n").length;var r;lines=new Array(n);lines=lines.join("<span></span>");r=document.createElement("span");r.className="line-numbers-rows";r.innerHTML=lines;if(t.hasAttribute("data-start")){t.style.counterReset="linenumber "+(parseInt(t.getAttribute("data-start"),10)-1)}e.element.appendChild(r)})
</script>
@yumesh
yumesh / Step:2 J-query(2) (Syntax Highlighter)
Created September 17, 2016 14:03
How to Implement Syntax Highlighter in Blogger or Blogspot Post.
<script type='text/javascript'>
var pres = document.getElementsByTagName(&quot;pre&quot;);
for (var i = 0; i &lt; pres.length; i++) {
pres[i].addEventListener(&quot;dblclick&quot;, function () {
var selection = getSelection();
var range = document.createRange();
range.selectNodeContents(this);
selection.removeAllRanges();
selection.addRange(range);
}, false);