ΑΡΧΙΚΗ ΚΑΤΑΣΚΕΥΗ Bloggs ΚΩΔΙΚΑΣ html JavaScript ΕΙΣΑΓΩΓΗ ManiacΑΝΑΛΥΣΗ Site ΕΙΔΗΣΕΩΝ GadgetManiac ΓΕΝΙΚΑ

Δευτέρα, 4 Μαρτίου 2013

Twitter Fan Box


Twitter fan box στο οποίο θα φαίνονται οι μέχρι τώρα followers μας και συγχρόνως θα μπορούν οι επισκέπτες μας να μας κάνουν follow, χωρίς να φύγουν από το Blog μας.

    Σύνδεση> Διάταξη>> Προσθήκη gadget HTML/JavaScript
    Επικόλληση και Αποθήκευση του παρακάτω κώδικα:

    <div class="textwidget">
    <script type="text/javascript" src="http://s.moopz.com/fanbox_init.js"></script><div id="twitterfanbox">
    <script type="text/javascript">fanbox_init("koui67");</script></div>
    </div>

    <style>
    .FB_SERVER_IFRAME {
    width: 240px !important; /* Ancho del gadget */
    height: 380px !important; /* Alto del gadget */
    }
    </style>


    με κόκκινο το koui67 το αντικαθίσταται με το δικό σας Twiter  username και οι αριθμοί είναι οι διαστάσεις που θέλετε να έχει.
ΠΕΡΙΣΣΟΤΕΡΑ

LIKE ΤΗΣ ΣΕΛΙΔΑΣ ΜΑΣ ΣΤΟ FACEBOOK


 Σύνδεση> Διάταξη>> Προσθήκη gadget >HTML/JavaScript

       Επικόλληση και Αποθήκευση του παρακάτω κώδικα:

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript">
    </script>
    <script type="text/javascript">
    //<!--
    $(document).ready(function() {$(".floatinglikebox").hover(function() {$(this).stop().animate({right: "0"}, "medium");}, function() {$(this).stop().animate({right: "-250"}, "medium");}, 500);});
    //-->
    </script>
    <style type="text/css">
    .floatinglikebox{background: url("http://3.bp.blogspot.com/-VXmAJdQRHJ8/Tra8E16fZGI/AAAAAAAAClg/o5M632x9qX8/s1600/floatingfb.png") no-repeat scroll left center transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 40px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:20%;}
    .floatinglikebox div{border:none;position:relative;display:block;}
    .floatinglikebox span{bottom: 10px;font: 10px tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}
    .floatinglikebox span a{color: #808080;text-decoration:none;}
    .floatinglikebox span a:hover{text-decoration:underline;}
    </style><div class="floatinglikebox" style="">
    <div>
    <iframe src="url της σελίδας σας στο facebook" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:251px; height:270px; background:#fff;" allowtransparency="true">
    </iframe><span><a href="http://lΤΟ ΜΠΛΟΚ ΜΑΣ/2012/12/facebook-like-box.html" target="_blank">Add this!</a></span>


</div></div>

           Εδώ http://developers.facebook.com/docs/reference/plugins/like-box/ μπορείτε να μπείτε για να πάρετε το url τις σελιδας σας στο facebook το οποίο θα το αντικαταστήσετε με αυτό' url της σελίδας σας στο facebook. 

ΠΕΡΙΣΣΟΤΕΡΑ

ΠΩΣ ΘΑ ΒΑΛΩ ΕΝΑ FACEBOOK LIKE ΣΤΟ BLOGS ΜΟΥ


FACEBOOK LIKE ΣΤΟ BLOGS


Με τον παρακάτω κώδικα μπορούμε να βάλουμε ένα facebook  Like κουμπί στο blogs μας που θα εμφανίζεται μονό στις αναρτήσεις μας.Πάμε λοιπόν με τον γνωστό τρόπο:
Σύνδεση>Blogger> πρότυπο> Επεξεργασία html> Επέκταση προτύπων γραφικών στοιχείων με το ctrl+F ψάχνουμε να βρούμε  το <data:post.body/>    η
<DIV class='post-footer'>
     αμέσως από κάτω του επικολλούσε τον κώδικα :


<b:if cond='data:blog.pageType == &quot;item&quot;'>
<iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; +
 data:post.url + &quot;&amp;layout=standard&amp;show_faces=false&amp;width=100&amp;action=like&amp;font=
arial&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:450px; height:40px;'/>
</b:if>


κάνουμε προεπισκόπηση και τέλος αποθήκευση.


ΠΕΡΙΣΣΟΤΕΡΑ

Κυριακή, 3 Μαρτίου 2013

ΕΜΦΑΝΙΣΗ ΣΧΕΤΙΚΩΝ ΑΝΑΡΤΗΣΕΩΝ ΣΤΟ ΤΕΛΟΣ ΜΙΑΣ ΑΝΑΡΤΗΣΗΣ


 Σύνδεση >Πρότυπο>Επεξεργασία HTML >  επέκταση προτύπων γραφικών στοιχείων


Α' ΤΡΟΠΟΣ:
Με το CTRL + F βρίσκουμε το </head> και ακριβώς από πάνω επικολλούμε το παρακάτω κώδικα:


<!--Διαβάστε ακόμα-related Posts with thumbnails starthead-->
<!-- remove -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'> #related-posts { float:center; text-transform:none; height:100%; min-height:100%; padding-top:5px; padding-left:5px; } #related-posts h2{ font-size: 18px; letter-spacing: 2px; font-weight: bold; text-transform: none; color: #5D5D5D; font-family: Arial Narrow; margin-bottom: 0.75em; margin-top: 0em; padding-top: 0em; } #related-posts a{ border-right: 1px dotted #DDDDDD; color:#5D5D5D; } #related-posts a:hover{ color:black; background-color:#EDEDEF; } </style>
<script type='text/javascript'> var defaultnoimage=&quot;http://3.bp.blogspot.com/-PpjfsStySz0/UF91FE7rxfI/AAAAAAAACl8/092MmUHSFQ0/s1600/no_image.jpg&quot;; var maxresults=8; var splittercolor=&quot;#DDDDDD&quot;; var relatedpoststitle=&quot;Διαβάστε ακόμα:&quot;; </script>
 <script src='https://googledrive.com/host/0B3fIJ7nZFI9ibXRUQzNjV3JyMXc/' type='text/javascript'/>
<!-- remove -->
</b:if>
<!--Διαβάστε ακόμα-related Posts with thumbnails endhead-->





Ακολούθως βρίσκουμε:  <div class='post-footer'>. Μόλις το βρούμε(μπορεί να υπάρχουν πάνω από ένα .Εμεις θα παμε στο τελευταιο) βάζουμε από κάτω του το πιο κάτω κώδικα


<!-- Διαβάστε ακόμα - Related Posts with Thumbnails start-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != &quot;true&quot;'>
</b:if>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=6&quot;' type='text/javascript'/>
</b:loop>
<script type='text/javascript'> removeRelatedDuplicates_thumbs(); printRelatedLabels_thumbs(&quot;<data:post.url/>&quot;); </script>
<a href='http://korfovouni-artas.blogspot.gr/' style='font-size:47%' target='_blank'>Κορφοβούνι Άρτας</a>
</div>
<div style='clear:both'/>
</b:if>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<b:if cond='data:post.isFirstPost'>
</b:if>
</b:if>
<!-- Διαβάστε ακόμα - Related Posts with Thumbnails End-->
---------------------------------------------------------------------------------------------------------------------------------------
Β΄ ΤΡΟΠΟΣ:

           Με το  CTRL + F βρίσκουμε το </head> απο πάνω επικολλούμε το παρακάτω κώδικα:

<!--Related Posts with thumbnails Scripts and Styles Start-->
<!-- remove --><b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
#related-posts {
float:center;
text-transform:none;
height:100%;
min-height:100%;
padding-top:5px;
padding-left:5px;
}

#related-posts h2{
font-size: 18px;
letter-spacing: 2px;
font-weight: bold;
text-transform: none;
color: #5D5D5D;
font-family: Arial Narrow;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
border-right: 1px dotted #DDDDDD;
color:#5D5D5D;
}
#related-posts a:hover{
color:black;
background-color:#EDEDEF;
}
</style>
<script type='text/javascript'>
var defaultnoimage=&quot;http://3.bp.blogspot.com/-PpjfsStySz0/UF91FE7rxfI/AAAAAAAACl8/092MmUHSFQ0/s1600/no_image.jpg&quot;;
var maxresults=5;
var splittercolor=&quot;#DDDDDD&quot;;
var relatedpoststitle=&quot;Related Posts&quot;;
</script>
<script src='http://helplogger.googlecode.com/svn/trunk/related-posts-with-big-thumbnails.js' type='text/javascript'/>
<!-- remove --></b:if>
<!--Related Posts with thumbnails Scripts and Styles End-->


Αν θέλουμε μπορούμε να αλλάξουμε τον αριθμο των αναρτησεων που θα εμφανιζονται εδώ "var maxresults=5;" και των "Related Posts" με κάτι που θέλουμε να γραφει σχετικό

                                Μετά βρίσκουμε αυτό των κώδικα
 <div class='post-footer'>

    και από κάτω(μπορεί να υπάρχουν πάνω από ένα .Εμεις θα παμε στο τελευταιο) επικολλούμε το παρακάτω κώδικα:

<!-- Related Posts with Thumbnails Code Start-->
<!-- remove --><b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != &quot;true&quot;'>
</b:if>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=6&quot;' type='text/javascript'/></b:loop>
<script type='text/javascript'>
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs(&quot;<data:post.url/>&quot;);
</script>
</div><div style='clear:both'/>
<!-- remove --></b:if>
<b:if cond='data:blog.url == data:blog.homepageUrl'><b:if cond='data:post.isFirstPost'>
<a href='http://helplogger.blogspot.com'><img alt='lefta4klik' src='http://3.bp.blogspot.com/-K65p5zLLKQk/T3ObCINoP7I/AAAAAAAABmI/dF84-alnOu4/s1600/best+blogger+tips.png'/></a>
</b:if></b:if>
<!-- Related Posts with Thumbnails Code End-->


                     κάνουμε μια προεπισκόπηση και τέλος  αποθήκευση .

        Ένας άλλος τρόπος είναι με την βοήθεια του http://www.linkwithin.com όπου αφού κανουμε λογαριασμό,επιλέγουμε τον τρόπο απεικόνισης του και παίρνουμε τον κώδικα και τον επικολλούμε στο σάιντ μας.
ΠΕΡΙΣΣΟΤΕΡΑ