• SANTORINI

    SANTORINI

  • SANTORINI

    SANTORINI

  • ZAKYNTHOS

    ZAKYNTHOS

  • LEYKADA

    LEYKADA

  • KEFALLONIA

    KEFALLONIA

  • KERKYRA

    KERKYRA

  • RODOS

    RODOS

GADGETS FOR BLOGS

YouTube GITHUB glitch.com JSBIN Start.me JSFIDDLE CODEPLY PASTEBIN.COM Repl.it CODEPEN CODEPEN

POPUP ARCHIVE PAGE No 1

Popup archive page 1
POPUP ARCHIVE PAGE No 1
Με τον παρακάτω κώδικα θα εμφανίζεται ένα button που θα γράφει ΑΡΧΕΙΟΘΗΚΗ ΑΝΑΡΤΗΣΕΩΝ και πατώντας το θα ανοίγει ένα popup παράθυρο με όλες τις αναρτήσεις που έχετε κάνει στο blog σας ταξινομημένες ανά ετικέτες. Θα πρέπει να έχε βάλει στις αναρτήσεις σας ετικέτες και θα πρέπει να γράψετε ακριβώς το ονομά τους μέσα στο script για να τις εμφανίσει. 

Παρακάτω εχω ένα αποσπασμα από τον κώδικα το οποίο θα πρέπει να επαναλαμβάνεται για κάθε ετικέτα που έχετε και πρέπει να αλλάξετε το όνομα της ετικέτας με τα πορτοκαλί γράμματα, το όνομα της ετικέτας μέσα στο script με τα κίτρινα γράμματα και το url του blog μου με τα γαλάζια γράμματα πρέπει να το αλλάξετε με την δική σας διεύθηνση url του δικού σας blog. Αλλάξτε και τον αριθμό που έχω επισημάνει με πράσινο χρώμα max-results=40 με το μέγιστο αριθμό που μπορεί να δεχθεί δηλαδή 150. Μπορείτε να αλλάξετε επίσης και το ύψος του popup παραθύρου από 1050 σε 750 για να χωράει και σε οθόνες laptop. Θα το βρείτε στην τελευταία γραμμή του <style> εκεί που γράφει  .popup .content {max-height:1050px;overflow: auto;} Ο κώδικας αυτός μπορεί να μπεί απλά σαν gadget σε κάποια πλευρική μπάρα είτε μέσα σε σελίδα ή ανάρτηση όπως εμφανίζεται το κουμπί ακριβώς εδώ από κάτω

ΑΡΧΕΙΟΘΗΚΗ ΑΝΑΡΤΗΣΕΩΝ

<div style="background:#173374;font:13px arial; float: left; text-align:left;padding:5px; width: 492px; height:auto;">
<b><span style="font-size: 14pt;"><span style="font-family: &quot;arial&quot;;">
<span style="background-color: yellow;"><span style="color: black;">ΟΡΙΖΟΝΤΙΑ ΚΑΙ ΚΑΘΕΤΑ ΜΕΝΟΥ</span></span></span></span></b>
<script src="https://the-best-widgets.blogspot.gr/feeds/posts/summary/-/ΟΡΙΖΟΝΤΙΑ ΚΑΙ ΚΑΘΕΤΑ ΜΕΝΟΥ?max-results=40&amp;alt=json-in-script&amp;callback=recentpostslist"></script></div>

  1
  2
  3
  4
  5
  6
  7
  8
  9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19
 20
 21
 22
 23
 24
 25
 26
 27
 28
 29
 30
 31
 32
 33
 34
 35
 36
 37
 38
 39
 40
 41
 42
 43
 44
 45
 46
 47
 48
 49
 50
 51
 52
 53
 54
 55
 56
 57
 58
 59
 60
 61
 62
 63
 64
 65
 66
 67
 68
 69
 70
 71
 72
 73
 74
 75
 76
 77
 78
 79
 80
 81
 82
 83
 84
 85
 86
 87
 88
 89
 90
 91
 92
 93
 94
 95
 96
 97
 98
 99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
<style>
.button {font:13px Arial;padding:5px;border:2px solid #FBBB22;background:#173377;color:#FFF;border-radius:5px;text-decoration:none;cursor:pointer;transition:all 0.2s ease-out;}
.button:hover {background:#105105;color:#FFF;border-color:#00FF00;}
.button:active {background:#255720;color:#FFF;border-color:#00FF00;}
.overlay {position:fixed;top:31px;left:0px;background:#333;transition:opacity 200ms;visibility:hidden;opacity:0; z-index:999;}
.overlay .cancel {position: absolute;width:auto;height:auto;cursor: default;}
.overlay:target {visibility: visible;opacity:1; z-index:999;}
.popup {width:1500px;height:auto;margin:0;padding:0px;background:#333;color:#FFF;position:relative; z-index:999;}
.popup .close {position: absolute;width:30px;height:30px;top:5px;right:100px;opacity:1;transition: all 200ms;font:bold 24px Arial;text-decoration:none;color: #FFFF00; z-index:999;}
.popup .close:hover {opacity: 1;}
.popup .content {max-height:750px;overflow: auto;}
</style>

<a class="button" href="#popup1">ΑΡΧΕΙΟΘΗΚΗ ΑΝΑΡΤΗΣΕΩΝ</a>
<div id="popup1" class="overlay">
<div class="popup">
<a class="close" href="#">&times;</a>
<div class="content">
<script src='https://rawgit.com/github-codes/aa4f492da387396fd5d6384c3df5d2ff/raw/fc6685bd6a8eda78454981b74a97ea23aa5012b3/archive-page-1p.js'></script>
<div style="position:relative;top:1px;left:0;background:#333; float: left; text-align:left;padding:0px; width:1500px; height:auto;">
<div style="background:#333; float: left; text-align:left;padding:0px; width:500px; height:auto;">
<div style="background:#173374;font:13px arial; float: left; text-align:left;padding:5px; width: 492px; height:auto;">
<b><span style="font-size: 14pt;"><span style="font-family: &quot;arial&quot;;"><span style="background-color: yellow;">
<span style="color: black;">ΟΡΙΖΟΝΤΙΑ ΚΑΙ ΚΑΘΕΤΑ ΜΕΝΟΥ</span></span></span> </span></b>
<script src="http://the-best-widgets.blogspot.gr/feeds/posts/summary/-/ΟΡΙΖΟΝΤΙΑ ΚΑΙ ΚΑΘΕΤΑ ΜΕΝΟΥ?max-results=40&amp;alt=json-in-script&amp;callback=recentpostslist"></script></div>

<div style="background:#661111;font:13px arial; float: left; text-align:left;padding:5px; width: 492px; height:auto;">
<b><span style="font-size: 14pt;"><span style="font-family: &quot;arial&quot;;"><span style="background-color: yellow;">
<span style="color: black;">ON LINE TOOLS</span></span></span> </span></b>
<script src="http://the-best-widgets.blogspot.gr/feeds/posts/summary/-/ON LINE TOOLS?max-results=30&amp;alt=json-in-script&amp;callback=recentpostslist"></script></div>

<div style="background:#173377;font:13px arial; float: left; text-align:left;padding:5px; width: 492px; height:auto;">
<b><span style="font-size: 14pt;"><span style="font-family: &quot;arial&quot;;"><span style="background-color: yellow;">
<span style="color: black;">FACEBOOK WIDGETS</span></span></span> </span></b>
<script src="http://the-best-widgets.blogspot.gr/feeds/posts/summary/-/FACEBOOK WIDGETS?max-results=150&amp;alt=json-in-script&amp;callback=recentpostslist"></script></div>

<div style="background:#532000;font:13px arial;float: left; text-align:left;padding:5px; width: 492px; height:auto;">
<b><span style="font-size: 14pt;"><span style="font-family: &quot;arial&quot;;"><span style="background-color: yellow;">
<span style="color: black;">ΑΛΛΑ WIDGETS ΓΙΑ BLOGS</span></span></span> </span></b>
<script src="http://the-best-widgets.blogspot.gr/feeds/posts/summary/-/WIDGETS ΓΙΑ BLOGS?max-results=150&amp;alt=json-in-script&amp;callback=recentpostslist"></script></div>

<div style="background:#1D3000;font:13px arial; float: left; text-align:left;padding:5px; width: 492px; height:auto;">
<b><span style="font-size: 14pt;"><span style="font-family: &quot;arial&quot;;"><span style="background-color: yellow;">
<span style="color: black;">ΤΑΞΙΝΟΜΗΣΗ ΑΝΑΡΤΗΣΕΩΝ</span></span></span> </span></b>
<script src="http://the-best-widgets.blogspot.gr/feeds/posts/summary/-/ΤΑΞΙΝΟΜΗΣΗ ΑΝΑΡΤΗΣΕΩΝ?max-results=150&amp;alt=json-in-script&amp;callback=recentpostslist"></script></div>

<div style="background:#740777;font:13px arial; float: left; text-align:left;padding:5px; width: 492px; height:auto;">
<b><span style="font-size: 14pt;"><span style="font-family: &quot;arial&quot;;"><span style="background-color: yellow;">
<span style="color: black;">ΣΧΟΛΙΑ BLOGGER</span></span></span> </span></b>
<script src="http://the-best-widgets.blogspot.gr/feeds/posts/summary/-/ΣΧΟΛΙΑ BLOGGER?max-results=150&amp;alt=json-in-script&amp;callback=recentpostslist"></script></div>

<div style="background:#000;font:13px arial; float: left; text-align:left;padding:5px; width: 492px; height:auto;">
<b><span style="font-size: 14pt;"><span style="font-family: &quot;arial&quot;;"><span style="background-color: yellow;">
<span style="color: black;">ΑΣΦΑΛΕΙΑ BLOG</span></span></span> </span></b>
<script src="http://the-best-widgets.blogspot.gr/feeds/posts/summary/-/ΑΣΦΑΛΕΙΑ BLOG?max-results=150&amp;alt=json-in-script&amp;callback=recentpostslist"></script></div>
</div>

<div style="background:#333; float: left; text-align:left;padding:0px; width:500px; height:auto;">
<div style="background:#105105;font:13px arial; float: left; text-align:left;padding:5px; width: 492px; height:auto;">
<b><span style="font-size: 14pt;"><span style="font-family: &quot;arial&quot;;"><span style="background-color: yellow;">
<span style="color: black;">ΜΟΡΦΟΠΟΙΗΣΗ BLOG</span></span></span> </span></b>
<script src="http://the-best-widgets.blogspot.gr/feeds/posts/summary/-/ΜΟΡΦΟΠΟΙΗΣΗ BLOG?max-results=40&amp;alt=json-in-script&amp;callback=recentpostslist"></script></div>

<div style="background:#333;font:13px arial; float: left; text-align:left;padding:5px; width: 492px; height:auto;">
<b><span style="font-size: 14pt;"><span style="font-family: &quot;arial&quot;;"><span style="background-color: yellow;">
<span style="color: black;">BACKGROUNDS</span></span></span> </span></b>
<script src="http://the-best-widgets.blogspot.gr/feeds/posts/summary/-/BACKGROUNDS?max-results=30&amp;alt=json-in-script&amp;callback=recentpostslist"></script></div>

<div style="background:#105105;font:13px arial; float: left; text-align:left;padding:5px; width: 492px; height:auto;">
<b><span style="font-size: 14pt;"><span style="font-family: &quot;arial&quot;;"><span style="background-color: yellow;">
<span style="color: black;">SOSIAL BUTTONS AND WINDOWS</span></span></span> </span></b>
<script src="http://the-best-widgets.blogspot.gr/feeds/posts/summary/-/SOSIAL BUTTONS?max-results=30&amp;alt=json-in-script&amp;callback=recentpostslist"></script></div>

<div style="background:#390851;font:13px arial; float: left; text-align:left;padding:5px; width: 492px; height:auto;">
<b><span style="font-size: 14pt;"><span style="font-family: &quot;arial&quot;;"><span style="background-color: yellow;">
<span style="color: black;">ΕΝΣΩΜΑΤΩΣΕΙΣ</span></span></span> </span></b>
<script src="http://the-best-widgets.blogspot.gr/feeds/posts/summary/-/ΕΝΣΩΜΑΤΩΣΗ ΑΡΧΕΙΩΝ?max-results=150&amp;alt=json-in-script&amp;callback=recentpostslist"></script></div>

<div style="background:#333;font:13px arial; float: left; text-align:left;padding:5px; width: 492px; height:auto;">
<b><span style="font-size: 14pt;"><span style="font-family: &quot;arial&quot;;"><span style="background-color: yellow;">
<span style="color: black;">TEXT BOXES</span></span></span> </span></b>
<script src="http://the-best-widgets.blogspot.gr/feeds/posts/summary/-/TEXT BOXES?max-results=150&amp;alt=json-in-script&amp;callback=recentpostslist"></script></div>

<div style="background:#808000;font:13px arial; float: left; text-align:left;padding:5px; width: 492px; height:auto;">
<b><span style="font-size: 14pt;"><span style="font-family: &quot;arial&quot;;"><span style="background-color: yellow;">
<span style="color: black;">CLOCKS AND CALENDARS</span></span></span> </span></b>
<script src="http://the-best-widgets.blogspot.gr/feeds/posts/summary/-/CLOCKS AND CALENDARS?max-results=150&amp;alt=json-in-script&amp;callback=recentpostslist"></script></div></div>

<div style="background:#333;float: left; text-align:left;padding:0px; width:500px; height:auto;">
<div style="background:#621061;font:13px arial; float: left; text-align:left;padding:5px; width: 492px; height:auto;">
<b><span style="font-size: 14pt;"><span style="font-family: &quot;arial&quot;;"><span style="background-color: yellow;">
<span style="color: black;">SLIDESHOWS</span></span></span> </span></b>
<script src="http://the-best-widgets.blogspot.gr/feeds/posts/summary/-/SLIDESHOWS?max-results=40&amp;alt=json-in-script&amp;callback=recentpostslist"></script></div>

<div style="background:#1D3000;font:13px arial; float: left; text-align:left;padding:5px; width: 492px; height:auto;">
<b><span style="font-size: 14pt;"><span style="font-family: &quot;arial&quot;;"><span style="background-color: yellow;">
<span style="color: black;">IMAGE EFFECTS</span></span></span> </span></b>
<script src="http://the-best-widgets.blogspot.gr/feeds/posts/summary/-/IMAGE EFFECTS?max-results=40&amp;alt=json-in-script&amp;callback=recentpostslist"></script></div>

<div style="background:#532000;font:13px arial;float: left; text-align:left;padding:5px; width: 492px; height:auto;">
<b><span style="font-size: 14pt;"><span style="font-family: &quot;arial&quot;;"><span style="background-color: yellow;">
<span style="color: black;">ΚΥΛΙΟΜΕΝΑ LINKS TEXT IMAGES</span></span></span> </span></b>
<script src="http://the-best-widgets.blogspot.gr/feeds/posts/summary/-/ΚΥΛΙΟΜΕΝΑ LINKS TEXT IMAGES?max-results=30&amp;alt=json-in-script&amp;callback=recentpostslist"></script></div>

<div style="background:#173377;font:13px arial; float: left; text-align:left;padding:5px; width: 492px; height:auto;">
<b><span style="font-size: 14pt;"><span style="font-family: &quot;arial&quot;;"><span style="background-color: yellow;">
<span style="color: black;">ΣΥΜΒΟΥΛΕΣ SEO</span></span></span> </span></b>
<script src="http://the-best-widgets.blogspot.gr/feeds/posts/summary/-/SEO?max-results=40&amp;alt=json-in-script&amp;callback=recentpostslist"></script></div>

<div style="background:#351500;font:13px arial; float: left; text-align:left;padding:5px; width: 492px; height:auto;">
<b><span style="font-size: 14pt;"><span style="font-family: &quot;arial&quot;;"><span style="background-color: yellow;">
<span style="color: black;">POST SLIDERS</span></span></span> </span></b>
<script src="http://the-best-widgets.blogspot.gr/feeds/posts/summary/-/POST SLIDER?max-results=40&amp;alt=json-in-script&amp;callback=recentpostslist"></script></div>

<div style="background:#006444;font:13px arial; float: left; text-align:left;padding:5px; width: 492px; height:auto;">
<b><span style="font-size: 14pt;"><span style="font-family: &quot;arial&quot;;"><span style="background-color: yellow;">
<span style="color: black;">VIDEO AND PHOTO GALLERIES</span></span></span> </span></b>
<script src="http://the-best-widgets.blogspot.gr/feeds/posts/summary/-/GALLERIES?max-results=40&amp;alt=json-in-script&amp;callback=recentpostslist"></script></div>

<div style="background:#290699;font:13px arial; float: left; text-align:left;padding:5px; width: 492px; height:auto;">
<b><span style="font-size: 14pt;"><span style="font-family: &quot;arial&quot;;"><span style="background-color: yellow;">
<span style="color: black;">COUNTERS</span></span></span> </span></b>
<script src="http://the-best-widgets.blogspot.gr/feeds/posts/summary/-/COUNTERS?max-results=40&amp;alt=json-in-script&amp;callback=recentpostslist"></script></div>

<div style="background:#661111;font:13px arial; float: left; text-align:left;padding:5px; width: 492px; height:auto;">
<b><span style="font-size: 14pt;"><span style="font-family: &quot;arial&quot;;"><span style="background-color: yellow;">
<span style="color: black;">ΧΡΙΣΤΟΥΓΕΝΝΙΑΤΙΚΑ GADGETS</span></span></span> </span></b>
<script src="http://the-best-widgets.blogspot.gr/feeds/posts/summary/-/CHRISTMAS WIDGETS?max-results=40&amp;alt=json-in-script&amp;callback=recentpostslist"></script></div></div></div></div></div></div>

Δεν υπάρχουν σχόλια:

Δημοσίευση σχολίου

► Γράψτε το σχόλιό σας στο λευκό κουτί και αν θέλετε να ειδοποιηθήτε για την απάντηση τσεκάρετε το κουτάκι "Να λαμβάνω ειδοποιήσεις".

Σημείωση: Μόνο ένα μέλος αυτού του ιστολογίου μπορεί να αναρτήσει σχόλιο.