Web Analytics Made Easy - StatCounter
FoulsCode

Εμφάνιση αναρτήσεων με ετικέτα Comment box. Εμφάνιση όλων των αναρτήσεων
Εμφάνιση αναρτήσεων με ετικέτα Comment box. Εμφάνιση όλων των αναρτήσεων

18 Νοεμβρίου 2017

Πρόσφατα σχόλια Blogger widget - comment




Ένα πολύ ωραίο widget για τα πρόσφατα σχόλια που κάνουν η αναγνώστες σας. Το πιο πρόσφατο εμφανίζεται στην κορυφή.


Αποτελείται από Html/javascript.

Προσαρμόζεται πάντο αυτόματα χωρίς καμια αλλαγή στον κώδικα του.





Κώδικας:


<link href='http://foulscode.xtgem.com/xtgem_template.css' rel='stylesheet'/>
<script type="text/javascript">
//<![CDATA[
var
numComments = 5,
showAvatar = true,
avatarSize = 35,
roundAvatar = true,
characters = 40,
defaultAvatar = "https://3.bp.blogspot.com/-sL6xl7eh7Mo/VueQmyj4WZI/AAAAAAAABmw/Cvr9T-GqDygLc_Hxt04_1L-MzNObOh6_Q/s1600/none.png",
hideCredits = true;
maxfeeds=50,
adminBlog='your name';
//]]>
</script>
<script type="text/javascript" src="http://foulscode.xtgem.com/widget-html-css/foulscode_com_comment_widge_1.js"></script>
<script type="text/javascript" src="/feeds/comments/default?alt=json&amp;callback=kangismet_recent&amp;&amp;max-results=50">
</script>



Προσαρμογή  Widget σχολίων


Μπορείτε να προσαρμόσετε αυτό το widget με μικρή τροποποίηση στην κωδικοποίησή του

numComments = 5 (εμφανίζεται ο αριθμός των σχολίων)
showAvatar = true (ψευδείς, αν θέλετε να κρύψετε το avatar)
avatarSize = 35 (το μέγεθος του avatar σε εικονοστοιχεία)
roundAvatar = true (γύρο avatar)
χαρακτήρες = 40 (ο αριθμός των χαρακτήρων το περιεχόμενο του σχολίου)
defaultAvatar = "https://3.bp.blogspot.com/-sL6xl7eh7Mo/VueQmyj4WZI/AAAAAAAABmw/Cvr9T-GqDygLc_Hxt04_1L-MzNObOh6_Q/s1600/none.png" (προεπιλεγμένο avatar)
adminBlog = 'your name' (το όνομα του συντάκτη του ιστολογίου, αντικαταστήστε με το όνομά σας)
Διαβάστε Περισσότερα »

31 Οκτωβρίου 2017

Facebook Like button στα WordPress post και γιατί πρέπει να αποφεύγεις τα plugin




Ας φωνάξουμε όλοι μαζί «κάτω τα plugin» για άλλη μια φορά! Ακριβώς, τα plugin στο WordPress αξίζουν μόνο αν προσθέτουν παπάδες μέσα. Για παράδειγμα το download monitor που σου επιτρέπει να ανεβάζεις αρχεία, κρατάει στατιστικά και άπειρα ακόμα πράματα.

Δυστυχώς υπάρχουν και plugin για απίστευτα απλά πράματα, που με λίγες γνώσεις ο καθένας μπορεί να κάνει μόνος χωρίς τα plugin. Ο λόγος στα plugin που απλά προσθέτουν το κουμπάκι «Like» για το WordPress αλλά φυσικά και τα υπόλοιπα παρόμοιου είδους.

Το μόνο που καταφέρνουν αυτά τα plugin είναι να καθυστερούν την δημιουργία της σελίδας (every ms matters), μιας και η τοποθέτηση αυτού του κουμπιού είναι απίστευτα απλή αφού απαιτεί την επεξεργασία ενός μόνο αρχείου! Αφήνουμε την εισαγωγή 3ων παραγράφων και προχωράμε στο θέμα μας.

Ως παράδειγμα θα χρησιμοποιήσω το Like plugin του Facebook. Είναι ένας καλός τρόπος για τσάμπα διαφήμιση, μιας και πατώντας το εμφανίζεται το site σου στο profile αυτού που το πάτησε. Τι γίνεται όταν θελήσεις να το βάλεις στο WordPress blog σου; Η πρώτη ιδέα που σου έρχεται είναι plugin. Και το κάνεις.

Με λίγο ψάξιμο στο Google θα βρείς άπειρους οδηγούς για το πως γίνεται. Να πω την αλήθεια ο σκοπός αυτού του post ήταν για το πως μπορείς να το κάνεις, αλλά υπάρχουν τόσοι οδηγοί που δεν αξίζει να ξαναγράφω τα ίδια.

Αυτά θα σε βοηθήσουν, για αρχή.



[*]How to – Add Facebook LIKE button to WordPress Posts
[*]HOW TO: Add Facebook “Like” Buttons to Your WordPress Blog
[*]How to Add Facebook Like Button in WordPress


via: giannoug.gr
Διαβάστε Περισσότερα »

23 Ιουλίου 2016

Most Commented Posts Widget for Blogger


Γεια σε όλους τους μπλόγκερ! Εδώ έχω βρει μια εμφάνιση ενός widget για τα σχόλια από τους επισκέπτες του site σας.

Για να το εφαρμόσετε στο blog σας κάνετε αντιγραφή επικόλληση τον παρακάτω κώδικα!




<style>
/* www.foulscode.com */
.commentbubble {
background: #292D30;
width: 49px;
float: left;
margin: 2px 20px 35px 0px;
font-weight: bold;
font-size: 1.3em;
text-align: right;
font-family: georgia,Helvetica;
padding: 0px 0px 5px 0px;
text-align: right;
color: #FFF;
text-shadow: 4px 1px #202022;
position: relative;
top: 5px;
}
.commentbubble:after {
content: ' ';
position: absolute;
width: 0;
height: 0;
right: 0px;
top: 100%;
border-width: 5px 8px;
border-style: solid;
border-color: #292D30 #292D30 rgba(0, 0, 0, 0) rgba(0, 0, 0, 0);
top: 34px;
right: 6px;
}
</style>
<script type="text/javascript">
function getYpipePP(feed) {
document.write('<ul style="list-style:none; ">');
var i;
for (i = 0; i < feed.count ; i++)
{
var href = "'" + feed.value.items[i].link + "'";
var pTitle = feed.value.items[i].title;
var pComment = + feed.value.items[i].commentcount;
var pList = '<li style="clear:both; padding:10px 0px 30px 0px!important;border-bottom: 1px dashed #dedede; line-height:2em; "> <div class="commentbubble">' +pComment + "&#160;&#160;</div>" + "<a href="+ href + '" target="_blank">' + pTitle ;
document.write(pList);
//to remove comment count delete this line
document.write('</a></li>');
}
document.write('</ul>');
}

/* www.foulscode.com */

</script>
<script src="http://pipes.yahoo.com/pipes/pipe.run?
YourBlogUrl=http://www.foulscode.com&ShowHowMany=6&_id=390e906036f48772b2ed4b5d837af4cd
&_callback=getYpipePP
&_render=json"
type="text/javascript"></script>


Αποθήκευση και είναι έτοιμο!





Διαβάστε Περισσότερα »

21 Ιουνίου 2015

Εγκαταστήστε Emoticon για τα σχόλια - Blogspot




Πηγαίνετε στη σελίδα HTML editor
Αντιγράψτε τον παρακάτω κώδικα και τοποθετήστε το δεξί πριν από / πάνω από τον κώδικα </ head>


<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" type="text/javascript"></script>
<script src="https://ivyth.googlecode.com/svn/js/emoticon.min.js" type="text/javascript"></script>


Αντιγράψτε τον παρακάτω κώδικα και τοποθετήστε το δεξί πριν από / πάνω από τον κώδικα </ body>


<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script type='text/javascript'>
//<![CDATA[
jQuery(document).ready(function () {emoticonx({
emoRange:"#comments p, div.emoWrap",
putEmoAbove:"iframe#comment-editor",
topText:"Klik untuk melihat code!",
emoMessage:"Untuk memasukkan emoticon setidaknya ada satu spasi sebelum kode emoticon."
})
});
//]]>
</script>
</b:if>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<script type='text/javascript'>
//<![CDATA[
jQuery(document).ready(function () {emoticonx({
emoRange:"#comments p, div.emoWrap",
putEmoAbove:"iframe#comment-editor",
topText:"Εδώ μπορείτε να γράψετε το μήνυμα σας.!",
emoMessage:"Εδώ μπορείτε να γράψετε το μήνυμα σας."
})
});
//]]>
</script>
</b:if> 


Όταν τελειώσετε, κάντε κλικ στο κουμπί Αποθήκευση προτύπου και δείτε τα αποτελέσματα.

 ΠΗΓΗ

Διαβάστε Περισσότερα »

2 Φεβρουαρίου 2015

Πως να βάλετε comment bot στην σελίδα σας!



Σε αυτό το σημείο θα σας πω πως πολύ εύκολα να βάλετε comment bot στο site σας, και λέω site και όχι blog γιατί όλα τα blog έχουν προσαρμοσμένα comment bot.

Το μονο που πρέπει να κάνετε είναι να μπείτε στην παρακάτω σελίδα και να κάνετε αντιγραφή και επικόλληση στην σελίδα που θέλετε να το βάλετε!


 

Διαβάστε Περισσότερα »

27 Μαρτίου 2013

Προσθέτοντας Disqus Widget στο blog σας.




Ένα Widget που εμφανίζει τους top που σχολιάζουν στο blog σας για αυτούς που χρησιμοποιούν την πλατφόρμα σχολειων http://disqus.com/


Αντιγραφή επικόλληση τον παρακάτω κώδικα: 




<div class="heading blue">
            <h2>Community</h2>
        </div>
        <script type="text/javascript" src="http://foulscode.disqus.com/combination_widget.js?num_items=5&hide_mods=1&color=grey&default_tab=recent&excerpt_length=30"></script>
    </div>



  • Αντικαταστήστε το foulscode με το δικό σας username.



  • greyΑλλάζοντας το επιλέγουμε το χρώμα.



Διαβάστε Περισσότερα »

Adding Disqus Top Commenters Widget To Blog



Ένα Widget που εμφανίζει τους top που σχολιάζουν στο blog σας για αυτούς που χρησιμοποιούν την πλατφόρμα σχολειων http://disqus.com/


Αντιγραφή επικόλληση τον παρακάτω κώδικα: 


<div id="topcommenters" class="dsq-widget"><h2 class="dsq-widget-title">Top Commenters</h2><script type="text/javascript" src="http://foulscode.disqus.com/top_commenters_widget.js?num_items=5&hide_mods=0&hide_avatars=0&avatar_size=32"></script></div>

  • Αντικαταστήστε το foulscode με το δικό σας username.


  • Το είναι ο αριθμός από τα σχολεια που θα εμφανίζονται.





Διαβάστε Περισσότερα »

11 Φεβρουαρίου 2013

Στυλ CSS στα Blogger σχόλια.2



Βρείτε τον παρακάτω κώδικα.


<b:include data='post' name='comments'/>


Τώρα αντικαταστήσει τον παραπάνω κωδικό με κωδικό παρακάτω.


 <b:if cond='data:post.showThreadedComments'>
<b:include data='post' name='threaded_comments'/>
<b:else/>
<b:include data='post' name='comments'/>
</b:if>


Τώρα βρείτε το ]]></b:skin> και πάνω από αυτό επικολλήστε το παρακάτω.




.comments {
    clear: both;
    margin-top: 10px;
    margin-bottom: 0px;
    line-height: 1em;
}
.comments .comments-content {
    font-size: 12px;
    margin-bottom: 16px;
    font-family: Verdana;
    font-weight: normal;
    text-align: left;
    line-height: 1.4em;
}
.comments .continue a, .comments .comment .comment-actions a {
    display: inline;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    padding: 2px 5px;
    text-decoration: none;
    text-shadow: 0 1px 1px rgba(0,0,0,.3);
    color: #FFF;
    -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
    -moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
    box-shadow: 0 1px 2px rgba(0,0,0,.2);
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    margin-right: 10px;
    border: 1px solid #3079ED;
    background: #0066FF;
    background: -webkit-gradient(linear, left top, left bottom, from(#0099FF), to(#009999));
    background: -moz-linear-gradient(top, #0099FF, #009999);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='
    #0099FF', endColorstr='#009999');
}
.comments .continue a:hover, .comments .comment .comment-actions a:hover {
    text-decoration: none;
    background: #0099FF;
    background: -webkit-gradient(linear, left top, left bottom, from(#009999), to(#0099FF));
    background: -moz-linear-gradient(top, #009999, #0099FF);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='
    #009999', endColorstr='#0099FF');
}
.comments .continue a:active, .comments .comment .comment-actions a:active {
    position: relative;
    top: 1px;
    background: -webkit-gradient(linear, left top, left bottom, from(#0066FF), to(#0099CC));
    background: -moz-linear-gradient(top, #0066FF, #0099CC);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='
    #0066FF', endColorstr='#0099CC');
}
.comments .comments-content .comment-thread ol {
    list-style-type: none;
    padding: 0;
    text-align: none;
}
.comments .comments-content .inline-thread {
    padding: 0.5em 1em 0 1em;
}
.comments .comments-content .comment-thread {
    margin: 8px 0px 0px 0px;
}
.comments .comments-content .comment-thread:empty {
    display: none;
}
.comments .comments-content .comment-replies {
    margin-top: 1em;
    margin-left: 40px;
    font-size: 12px;
}
.comments .comments-content .comment {
    padding-bottom: 8px;
    margin-bottom: 0px
}
.comments .comments-content .comment:first-child {
    padding-top: 16px;
}
.comments .comments-content .comment:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}
.comments .comments-content .comment-body {
    position: relative;
}
.comments .comments-content .user {
    font-style: normal;
    font-weight: bold;
}
.comments .comments-content .user a {
    color: #444;
}
.comments .comments-content .user a:hover {
    text-decoration: none;
    color: #555;
}
.comments .comments-content .icon.blog-author {
    width: 18px;
    height: 18px;
    display: inline-block;
    margin: 0 0 -4px 6px;
}
.comments .comments-content .datetime {
    margin-left: 6px;
    color: #999;
    font-style: italic;
    font-size: 11px;
    float: right;
}
.comments .comments-content .comment-content {
    font-family: Arial, sans-serif;
    font-size: 12.5px;
    line-height: 19px;
}
.comments .comments-content .comment-content {
    font-family: Arial, sans-serif;
    font-size: 12.5px;
    line-height: 19px;
    text-align: none;
    margin: 15px 0 15px;
}
.comments .comments-content .owner-actions {
    position: absolute;
    right: 0;
    top: 0;
}
.comments .comments-replybox {
    border: none;
    height: 250px;
    width: 100%;
}
.comments .comment-replybox-single {
    margin-top: 5px;
    margin-left: 48px;
}
.comments .comment-replybox-thread {
    margin-top: 5px;
}
.comments .comments-content .loadmore a {
    display: block;
    padding: 10px 16px;
    text-align: center;
}
.comments .thread-toggle {
    cursor: pointer;
    display: inline-block;
}
.comments .comments-content .loadmore {
    cursor: pointer;
    max-height: 3em;
    margin-top: 3em;
}
.comments .comments-content .loadmore.loaded {
    max-height: 0px;
    opacity: 0;
    overflow: hidden;
}
.comments .thread-chrome.thread-collapsed {
    display: none;
}
.comments .thread-toggle {
    display: inline-block;
}
.comments .thread-toggle .thread-arrow {
    display: inline-block;
    height: 6px;
    width: 7px;
    overflow: visible;
    margin: 0.3em;
    padding-right: 4px;
}
.comments .thread-expanded .thread-arrow {
    background: url("
    data: image/png;
    base64,iVBORw0KGgoAAAANSUhEUgAAAAc AAAAHCAYAAADEUlfTAAAAG0lEQVR42mNgwAfKy8v/48I4FeA0AacVDFQBAP9wJkE/KhUMAAAAAElFTkSuQmCC") no-repeat scroll 0 0 transparent;
}
.comments .thread-collapsed .thread-arrow {
    background: url("
    data: image/png;
    base64,iVBORw0KGgoAAAANSUhEUgAAA AcAAAAHCAYAAADEUlfTAAAAJUlEQVR42mNgAILy8vL/DLgASBKnApgkVgXIkhgKiNKJ005s4gDLbCZBiSxfygAAAAB JRU5ErkJggg==") no-repeat scroll 0 0 transparent;
}
.comments .avatar-image-container {
    float: left;
    overflow: hidden;
}
.comments .avatar-image-container img {
    width: 36px;
}
.comments .comment-block {
    margin-left: 48px;
    position: relative;
    padding: 15px 20px 15px 20px;
    background: #F7F7F7;
    border: 1px solid #E4E4E4;
    overflow: hidden;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-image: initial;
}


Αποθηκεύστε και τελειώσατε.



Διαβάστε Περισσότερα »

10 Φεβρουαρίου 2013

Πρόσφατα σχόλια Widget Blogspot


Γεια σε όλους τους μπλόγκερ :)

Σε αυτό το θέμα θα μοιραστώ μαζί σας ένα widget για τα πρόσφατα σχολεια του blog σας! Είναι αρκετά χρήσιμο πιστεύω για πόλους από εσάς, πάμε να αρχίσουμε.


Αντιγράψτε και κάντε επικόλληση τον παρακάτω κώδικα εκεί που θέλετε.



<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" type="text/javascript"></script>
<script src="http://foulsblog.xtgem.com/foulsblog-dgn-animasi.js" type="text/javascript"></script>
<div id="rcentcomnets"><span class="loadingxrcm">Loading...</span></div>
<script type="text/javascript">
//<![CDATA[
$(document).ready(function () {
rccommnetsx({
id_containrc:"#rcentcomnets",
animatedRecentcomments:true,
numComments:10,
url_blog:"URL_blog",
adminBlog:"FoulsCode"
});
});
//]]>
</script>

Στην συνεχεια κάντε αναζήτηση το ]]></b:skin> και πριν από αυτό επικόλληση τον κώδικα CSS.


Light Themes




.loadingxrcm {background:transparent url(http://2.bp.blogspot.com/-Hus9BJOr9-8/UOsgyp7_8rI/AAAAAAAAH34/g2TQbl7GcsY/s1600/progress_ani.gif) no-repeat 50% 50%;width:32px;height:32px;display:block;margin:0 auto;text-indent:-9999px;}
ul#kmtranimasi{text-align:left;font:normal normal 11px Verdana,Geneva,sans-serif}
ul#kmtranimasi,ul#kmtranimasi li{margin:0;padding:0;list-style:none;overflow:hidden;position:relative}
ul#kmtranimasi li{text-indent:0;height:90px;background:whiteSmoke;padding:0 8px;border:1px solid #DFDFDF;border-top:1px solid white}
ul#kmtranimasi img{border-radius:9999px;overflow:hidden;background:#383838;border:0;float:left;margin:5px 5px 0 0}
ul#kmtranimasi .ketkomt{overflow:hidden}
ul#kmtranimasi .ketkomt a{display:block;color:white;font-weight:bold;overflow:hidden;background:#363636;border-radius:2px;float:left;padding:0 5px;margin: 5px 0 0 0;}
ul#kmtranimasi .ketkomt span{font-size:8px;position:absolute;z-index:2;top:21px;border-radius:2px;display:block;line-height:14px;padding:0 5px;left:68px;background:white}
ul#kmtranimasi p{margin:15px 0 0}



Dark Theme




.loadingxrcm {background:transparent url(http://2.bp.blogspot.com/-Hus9BJOr9-8/UOsgyp7_8rI/AAAAAAAAH34/g2TQbl7GcsY/s1600/progress_ani.gif) no-repeat 50% 50%;width:32px;height:32px;display:block;margin:0 auto;text-indent:-9999px;}
ul#kmtranimasi{text-align:left;font:normal normal 11px Verdana,Geneva,sans-serif}
ul#kmtranimasi,ul#kmtranimasi li{margin:0;padding:0;list-style:none;overflow:hidden;position:relative}
ul#kmtranimasi li{text-indent:0;height:90px;padding:0 8px;background:#252525;color:white;border:1px solid black;border-top:1px solid #353535}
ul#kmtranimasi img{border-radius:9999px;overflow:hidden;background:#020202;border:0;float:left;margin:5px 5px 0 0}
ul#kmtranimasi .ketkomt{overflow:hidden}
ul#kmtranimasi .ketkomt a{display:block;color:black;font-weight:bold;overflow:hidden;background:#ECECEC;border-radius:2px;float:left;padding:0 5px;margin: 5px 0 0 0;}
ul#kmtranimasi .ketkomt span{font-size:8px;position:absolute;z-index:2;top:21px;border-radius:2px;display:block;line-height:14px;padding:0 5px;left:68px;background:black}
ul#kmtranimasi p{margin:15px 0 0}


Αποθήκευση και είστε έτοιμη.


(via)


Διαβάστε Περισσότερα »

7 Φεβρουαρίου 2013

Προσθέσετε αριθμούς στα σχολεια του blogger




Μετάβαση στο Blogger Template ταμπλό>
Κατεβάστε ένα αντίγραφο του προτύπου σας
Κάντε κλικ στο Επεξεργασία HTML
Πατήστε Συνέχεια
Τώρα αναζητήσετε παρακάτω κώδικα,



]]></b:skin>


προσθέσετε παρακάτω κώδικα ακριβώς από πάνω του,


.comment-thread ol {
    counter-reset: countcomments;
}

.comment-thread li:before {
    content: counter(countcomments,decimal);
    counter-increment: countcomments;
    float: right;
    font-size: 22px;
    color: #555555;
    padding-left: 10px;
    padding-top: 3px;
    background: url(http://3.bp.blogspot.com/-f6ByQfbwApQ/T4x_8p1FGpI/AAAAAAAAB2A/WJKf-ybmvQk/s1600/comment+bubble2.png) no-repeat;
    margin-top: 7px;
    margin-left: 10px;
    width: 50px;
 /*image-width size*/
    height: 48px;
 /*image-height size*/
}

.comment-thread ol ol {
    counter-reset: contrebasse;
}

.comment-thread li li:before {
    content: counter(countcomments,decimal) "." counter(contrebasse,lower-latin);
    counter-increment: contrebasse;
    float: right;
    font-size: 18px;
    color: #666666;


Αντιγραφή διεύθυνσης URL εικόνας και να την αντικαταστήσει με την παραπάνω διεύθυνση URL



how to blog    blogger blogspot    blogspot blogger, how to blog    widget blogger blogspot    blogs, how to blog     blogspot or blogger, how to blog    tutorials, how to    comments, how to, blogspot blogger    new comment, how to blog    blog design, blogger blogger.com                   bubble comment count, bubble blogger posts   blogger comments, comment count    blogger blogspot, blogger comments   blogger bubble comment count   comments in blogger titles    blogger tips, blogger tricks   blogger widgets, bubble comment count    bubble comment count    Bubble Comment Count    Bubble Comment Count, blogger blogspot                                


(via)


Διαβάστε Περισσότερα »

2 Φεβρουαρίου 2013

Στυλ CSS στα Blogger σχόλια.





1) Πρώτα, συνδεθείτε στο λογαριασμό σας Blogger.
2) Κάντε κλικ στο Σχεδίαση. και επιλέξτε Επεξεργασία HTML.



Πριν ξεκινήσουμε:
- Πρέπει να είστε προσεκτικοί κατά την αλλαγή του προτύπου σας.
- Πριν κάνετε οποιαδήποτε αλλαγή, αποθηκεύστε το πρότυπο σας σε ασφαλή μέρος (Στον υπολογιστή σας).

3) Ψάξτε για τον παρακάτω κώδικα (Ctl+F):


]]></b:skin>
4) Αντιγράψτε και επικολλήστε τον παρακάτω κώδικα ακριβώς πάνω από το ]]></b:skin>.


/* Start Comment Style Code http://www.FoulsCode.blogspot.gr */.comments{clear:both;margin-top:10px;margin-bottom:0;font-family:Arial;line-height:18px;font-size:13px}.comments .comments-content{margin-bottom:16px;font-weight:normal;text-align:left}.comments .comment .comment-actions a,.comments .comment .continue a{display:inline-block;margin:0 0 10px 10px;padding:0 15px;color:#424242 !important;text-align:center;text-decoration:none;background:#fede72;border:1px solid #fec648;border-radius:2px;height:26px;line-height:28px;font-weight:normal;cursor:pointer}.comments .comments-content .comment-thread ol{list-style-type:none;padding:0;text-align:none}.comments .comments-content .inline-thread{padding:0}.comments .comments-content .comment-thread{margin:8px 0}.comments .comments-content .comment-thread:empty{display:none}.comment-replies{margin-top:1em;margin-left:40px;background:#fff}.comments .comments-content .comment{margin-bottom:0;padding-bottom:0}.comments .comments-content .comment:first-child{padding-top:16px}.comments .comments-content .comment:last-child{border-bottom:0;padding-bottom:0}.comments .comments-content .comment-body{position:relative}.comments .comments-content .user{font-style:normal;font-weight:normal}.comments .comments-content .user a{color:#0E6284;font-weight:normal;text-decoration:none}.comments .comments-content .icon.blog-author{width:18px;height:18px;display:inline-block;margin:0 0 -4px 6px}.comments .comments-content .datetime a{color:#0E6284;font-size:12px;float:right;text-decoration:none}.comment-content{margin:0 0 8px;padding:0 5px}.comment-header{font-size:18px;background-color:#f1f1f1;border-bottom:1px solid #e3e3e3;padding:5px}.comments .comments-content .owner-actions{position:absolute;right:0;top:0}.comments .comments-replybox{border:none;height:230px;width:100%}.comments .comment-replybox-thread{margin-top:0}.comments .comment-replybox-single{margin-top:5px;margin-left:48px}.comments .comments-content .loadmore a{display:block;padding:10px 16px;text-align:center}.comments .thread-toggle{cursor:pointer;display:inline-block}.comments .comments-content .loadmore{cursor:pointer;max-height:3em;margin-top:0}.comments .comments-content .loadmore.loaded{max-height:0;opacity:0;overflow:hidden}.comments .thread-chrome.thread-collapsed{display:none}.comments .thread-toggle{display:inline-block}.comments .thread-toggle .thread-arrow{display:inline-block;height:6px;width:7px;overflow:visible;margin:0.3em;padding-right:4px}.comments .thread-expanded .thread-arrow{background:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAc AAAAHCAYAAADEUlfTAAAAG0lEQVR42mNgwAfKy8v/48I4FeA0AacVDFQBAP9wJkE/KhUMAAAAAElFTkSuQmCC") no-repeat scroll 0 0 transparent}.comments .thread-collapsed .thread-arrow{background:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAA AcAAAAHCAYAAADEUlfTAAAAJUlEQVR42mNgAILy8vL/DLgASBKnApgkVgXIkhgKiNKJ005s4gDLbCZBiSxfygAAAAB JRU5ErkJggg==") no-repeat scroll 0 0 transparent}.avatar-image-container{background:url(https://lh5.googleusercontent.com/-Wmy6bwNKzbo/T0miLZkuJsI/AAAAAAAAChc/orbwMGHyBxA/s51/arrow.png) top right no-repeat;float:left;vertical-align:middle;overflow:hidden;width:65px !important;height:51px !important;max-width:65px !important;max-height:51px !important}.comments .avatar-image-container img{padding:2px;border:1px solid #ccc;width:45px !important;height:45px !important;max-width:45px !important;max-height:45px !important}.comments .comment-block{margin-left:65px;position:relative;border:5px solid #e3e3e3;border-radius:8px}@media screen and (max-device-width:480px){.comments .comments-content .comment-replies{margin-left:0}}/* End Comment Style Code http://www.FoulsCode.blogspot.gr */

-Αποθηκεύσετε το πρότυπο.

Και αυτό ήταν τώρα μπορείτε να απολαύετε τα καινούργια σας σχόλια.


Είναι κάτι εύκολο αν έχετε απορία σε κάτι αφήστε το σχολειό σας!




Διαβάστε Περισσότερα »

9 Ιανουαρίου 2013

Πρόσφατα σχόλια Widget Blogspot Animation


Για να δείτε εάν ή όχι ένα νέο σχόλιο, σε συνδυασμό συνήθως blogger πλαϊνή μπάρα widget τμήμα σχολίων. Λοιπόν αυτή τη φορά θα μοιραστούν τα τελευταία σχόλια widget με κινούμενα σχέδια και ελέγχους διαχειριστή. Σε αντίθεση με την προηγούμενη widget, το widget αυτή τη φορά είναι εξοπλισμένα με avatar μου και εφέ κίνησης που είναι παρόμοια με πρόσφατη widget θέσεις με κινούμενα σχέδια.
Στην εγκατάσταση το blog σας, ακολουθήστε τα παρακάτω βήματα:

Προσθέστε ένα στοιχείο σελίδα HTML / JavaScript και στη συνέχεια αντιγράψτε τον κώδικα και τοποθετήστε το σε μορφή:


<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" type="text/javascript"></script><script src="http://fcode.xtgem.com/rckmtr-dgn-animasi.js" type="text/javascript"></script><br />
<div id="rcentcomnets">
<span class="loadingxrcm">Loading...</span></div>
<script type="text/javascript">//<![CDATA[$(document).ready(function () {rccommnetsx({id_containrc:"#rcentcomnets",animatedRecentcomments:true,numComments:10,url_blog:"URL_blogmu",adminBlog:"nama_akun blogger/google+"});});//]]></script>


Δίπλα στο Blogger> Ρυθμίσεις> Πρότυπο. Σημείωση: Δημιουργήστε αντίγραφα ασφαλείας του προτύπου σας πρώτα και στη συνέχεια κάντε κλικ στο κουμπί Επεξεργασία HTML> Συνέχεια.

Στη συνέχεια, βάλτε ένα με τον κωδικό CSS πριν]]> </ b:> 
Light Themes
.loadingxrcm {background:transparent url(http://2.bp.blogspot.com/-Hus9BJOr9-8/UOsgyp7_8rI/AAAAAAAAH34/g2TQbl7GcsY/s1600/progress_ani.gif) no-repeat 50% 50%;width:32px;height:32px;display:block;margin:0 auto;text-indent:-9999px;}ul.#kmtranimasi{text-align:left;font:normal normal 11px Verdana,Geneva,sans-serif}ul.#kmtranimasi,ul.#kmtranimasi li{margin:0;padding:0;list-style:none;overflow:hidden;position:relative}ul.#kmtranimasi li{height:90px;background:whiteSmoke;padding:0 8px;border:1px solid #DFDFDF;border-top:1px solid white}ul.#kmtranimasi img{border-radius:9999px;overflow:hidden;background:#383838;border:0;float:left;margin:5px 5px 0 0}ul.#kmtranimasi .ketkomt{overflow:hidden}ul.#kmtranimasi .ketkomt a{display:block;color:white;font-weight:bold;overflow:hidden;background:#363636;border-radius:2px;float:left;padding:0 5px;margin: 5px 0 0 0;}ul.#kmtranimasi .ketkomt span{font-size:8px;position:absolute;z-index:2;top:21px;border-radius:2px;display:block;line-height:14px;padding:0 5px;left:68px;background:white}ul.#kmtranimasi p{margin:15px 0 0}



Dark Themes

.loadingxrcm {background:transparent url(http://2.bp.blogspot.com/-Hus9BJOr9-8/UOsgyp7_8rI/AAAAAAAAH34/g2TQbl7GcsY/s1600/progress_ani.gif) no-repeat 50% 50%;width:32px;height:32px;display:block;margin:0 auto;text-indent:-9999px;}ul.#kmtranimasi{text-align:left;font:normal normal 11px Verdana,Geneva,sans-serif}ul.#kmtranimasi,ul.#kmtranimasi li{margin:0;padding:0;list-style:none;overflow:hidden;position:relative}ul.#kmtranimasi li{height:90px;padding:0 8px;background:#252525;color:white;border:1px solid black;border-top:1px solid #353535}ul.#kmtranimasi img{border-radius:9999px;overflow:hidden;background:#020202;border:0;float:left;margin:5px 5px 0 0}ul.#kmtranimasi .ketkomt{overflow:hidden}ul.#kmtranimasi .ketkomt a{display:block;color:black;font-weight:bold;overflow:hidden;background:#ECECEC;border-radius:2px;float:left;padding:0 5px;margin: 5px 0 0 0;}ul.#kmtranimasi .ketkomt span{font-size:8px;position:absolute;z-index:2;top:21px;border-radius:2px;display:block;line-height:14px;padding:0 5px;left:68px;background:black}ul.#kmtranimasi p{margin:15px 0 0}


DEMO



ΠΗΓΗ

Διαβάστε Περισσότερα »
Related Posts Plugin for WordPress, Blogger...