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:
"arial";">
<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&alt=json-in-script&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="#">×</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: "arial";"><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&alt=json-in-script&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: "arial";"><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&alt=json-in-script&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: "arial";"><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&alt=json-in-script&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: "arial";"><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&alt=json-in-script&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: "arial";"><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&alt=json-in-script&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: "arial";"><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&alt=json-in-script&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: "arial";"><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&alt=json-in-script&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: "arial";"><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&alt=json-in-script&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: "arial";"><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&alt=json-in-script&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: "arial";"><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&alt=json-in-script&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: "arial";"><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&alt=json-in-script&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: "arial";"><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&alt=json-in-script&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: "arial";"><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&alt=json-in-script&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: "arial";"><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&alt=json-in-script&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: "arial";"><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&alt=json-in-script&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: "arial";"><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&alt=json-in-script&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: "arial";"><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&alt=json-in-script&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: "arial";"><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&alt=json-in-script&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: "arial";"><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&alt=json-in-script&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: "arial";"><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&alt=json-in-script&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: "arial";"><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&alt=json-in-script&callback=recentpostslist"></script></div></div></div></div></div></div> |
