28 de abr de 2008

Calendário de arquivos

Este é um calendário que funciona como arquivo do seu blog, mostrando os dias que você postou, as postagens daquele dia, assim, tudo que estiver relacionado a um determinado dia, o calendário apontará.


Não se esqueça de antes de começar salvar uma cópia de seu template, caso não dê certo, é só reinstalá-lo.




Clique AQUI e veja o exemplo.

Mais uma dica do blog Purple Moggy's

Copie o primeiro código e cole em seu HTML antes do código : </head>
ATENÇÃO: coloque o endereço de seu blog no local em vermelho ( mas sem a barra final / ) e o horário do seu relógio no local em azul.

Pegar 1º código






    <!-- CODIGO CALENDARIO -->
    <!-- PARTE 1 -->
    <script src='http://yui.yahooapis.com/2.2.0/build/yahoo-dom-event/yahoo-dom-event.js' type='text/javascript'/>
    <script src='http://yui.yahooapis.com/2.2.0/build/calendar/calendar-min.js' type='text/javascript'/>
    <link href='http://yui.yahooapis.com/2.2.0/build/calendar/assets/calendar.css' rel='stylesheet' type='text/css'/>
    <!-- FIN DE PARTE 1 -->
    <!-- PARTE 2 -->
    <script type='text/javascript'>
    //<![CDATA[
    /*
    Created by: PurpleMoggy
    http://purplemoggy.blogspot.com
    */
    var _yourBlogUrl = "AQUI O ENDEREÇO DO SEU BLOG"; //edit this
    var _yourBlogTimeZone = "+01:00"; //edit this
    _yourBlogTimeZone = encodeURIComponent(_yourBlogTimeZone);
    var _dayTitles = new Array("","","","","","","","","","","","","","","","","","","","","","","","","","","","","","","");
    YAHOO.namespace("example.calendar");
    function cal1Init() {
    YAHOO.example.calendar.cal1 = new YAHOO.widget.Calendar("cal1","cal1Container");
    YAHOO.example.calendar.cal1.addMonthRenderer(1, YAHOO.example.calendar.cal1.renderBodyCellRestricted);
    YAHOO.example.calendar.cal1.addMonthRenderer(2, YAHOO.example.calendar.cal1.renderBodyCellRestricted);
    YAHOO.example.calendar.cal1.addMonthRenderer(3, YAHOO.example.calendar.cal1.renderBodyCellRestricted);
    YAHOO.example.calendar.cal1.addMonthRenderer(4, YAHOO.example.calendar.cal1.renderBodyCellRestricted);
    YAHOO.example.calendar.cal1.addMonthRenderer(5, YAHOO.example.calendar.cal1.renderBodyCellRestricted);
    YAHOO.example.calendar.cal1.addMonthRenderer(6, YAHOO.example.calendar.cal1.renderBodyCellRestricted);
    YAHOO.example.calendar.cal1.addMonthRenderer(7, YAHOO.example.calendar.cal1.renderBodyCellRestricted);
    YAHOO.example.calendar.cal1.addMonthRenderer(8, YAHOO.example.calendar.cal1.renderBodyCellRestricted);
    YAHOO.example.calendar.cal1.addMonthRenderer(9, YAHOO.example.calendar.cal1.renderBodyCellRestricted);
    YAHOO.example.calendar.cal1.addMonthRenderer(10, YAHOO.example.calendar.cal1.renderBodyCellRestricted);
    YAHOO.example.calendar.cal1.addMonthRenderer(11, YAHOO.example.calendar.cal1.renderBodyCellRestricted);
    YAHOO.example.calendar.cal1.addMonthRenderer(12, YAHOO.example.calendar.cal1.renderBodyCellRestricted);
    YAHOO.example.calendar.cal1.selectEvent.subscribe(mySelectHandler, YAHOO.example.calendar.cal1, true);
    YAHOO.example.calendar.cal1.changePageEvent.subscribe(myChangePageHandler, YAHOO.example.calendar.cal1, true);
    YAHOO.example.calendar.cal1.renderEvent.subscribe(syncMonthYear);
    YAHOO.example.calendar.cal1.render();
    myChangePageHandler();
    };
    var myChangePageHandler = function(type,args,obj) {
    var month = YAHOO.example.calendar.cal1.cfg.getProperty("pagedate").getMonth() + 1;
    if (month.toString().length == 1) {
    month = "0" + month;
    }
    var year = YAHOO.example.calendar.cal1.cfg.getProperty("pagedate").getFullYear();
    document.getElementById("cal1Titles").innerHTML = "";
    _dayTitles = new Array("","","","","","","","","","","","","","","","","","","","","","","","","","","","","","","");
    checkPostsForMonth(month, year);
    };
    function checkPostsForMonth(month,year) {
    document.getElementById("cal1loadimg").style.display = "block";
    var script = document.createElement("script");
    script.setAttribute("type", "text/javascript");
    var theUrl = _yourBlogUrl +"/feeds/posts/summary?alt=json-in-script&callback=checkPostsCallback&published-min=" + year + "-" + month + "-01T00%3A00%3A00" + _yourBlogTimeZone + "&published-max=" + year + "-" + month + "-31T23%3A59%3A59" + _yourBlogTimeZone + "&max-results=100";
    script.setAttribute("src", theUrl);
    document.documentElement.firstChild.appendChild(script);
    };
    function checkPostsCallback(json) {
    if (json.feed.entry) {
    for(i = 0; i < json.feed.entry.length; i++) {
    var month = json.feed.entry[i].published.$t.substr(5,2);
    var year = json.feed.entry[i].published.$t.substr(0,4);
    var day = json.feed.entry[i].published.$t.substr(8,2);
    var date = month + "/" + day + "/" + year;
    var href = json.feed.entry[i].link[0].href;
    var title = json.feed.entry[i].title.$t;
    if (day.substr(0,1) == "0") {
    day = day.substr(1);
    }
    document.getElementById("cal1Titles").innerHTML += "<li><a href='" + href + "'>" + title + "</a>";
    _dayTitles[day] += "<li><a href='" + href + "'>" + title + "</a>";
    YAHOO.example.calendar.cal1.addRenderer(date, myCustomRenderer);
    }
    YAHOO.example.calendar.cal1.render();
    }
    document.getElementById("cal1loadimg").style.display = "none";
    };
    function showDayTitles(day) {
    document.getElementById("cal1Titles").innerHTML = _dayTitles[day];
    }
    var myCustomRenderer = function(workingDate, cell) {
    var day = workingDate.toString().substr(8,2);
    if (day.substr(0,1) == "0") {
    day = day.substr(1);
    }
    cell.innerHTML = '<div onmouseover="showDayTitles(' + day + ');"><a href="javascript:void(null);" >' + YAHOO.example.calendar.cal1.buildDayLabel(workingDate) + "</a></div>";
    YAHOO.util.Dom.addClass(cell, YAHOO.example.calendar.cal1.Style.CSS_CELL_SELECTABLE);
    YAHOO.util.Dom.addClass(cell, YAHOO.example.calendar.cal1.Style.CSS_CELL_HIGHLIGHT1);
    return YAHOO.widget.Calendar.STOP_RENDER;
    }
    var mySelectHandler = function(type,args,obj) {
    var dates = args[0];
    var date = dates[0];
    var year = date[0];
    var month = date[1];
    if (month.toString().length == 1) {
    month = "0" + month;
    }
    var day = date[2];
    var element = YAHOO.util.Dom.getElementsByClassName("d" + day, "td", "cal1Container")[0];
    if (day.toString().length == 1) {
    day = "0" + day;
    }
    if (element.className.indexOf("highlight1") != -1) {

    window.location = _yourBlogUrl + "/search?updated-min=" + year + "-" + month + "-" + day +
    "T00%3A00%3A00" + _yourBlogTimeZone + "&updated-max=" + year + "-" + month + "-" + day +
    "T23%3A59%3A59" + _yourBlogTimeZone;
    }
    };
    var changeDate = function() {
    YAHOO.example.calendar.cal1.setMonth(parseInt(YAHOO.util.Dom.get("cal1monthselect").value));
    YAHOO.example.calendar.cal1.setYear(parseInt(YAHOO.util.Dom.get("cal1yearselect").value));
    YAHOO.example.calendar.cal1.render();
    myChangePageHandler();
    }
    var syncMonthYear = function(type) {
    YAHOO.util.Dom.get("cal1monthselect").value = parseInt(YAHOO.example.calendar.cal1.cfg.getProperty("pagedate").getMonth());
    var fullYear = parseInt(YAHOO.example.calendar.cal1.cfg.getProperty("pagedate").getFullYear());
    var isYearFound = false;
    var i = 0;
    while(i < document.getElementById("cal1yearselect").options.length && !isYearFound) {
    if (document.getElementById("cal1yearselect").options[i].value == fullYear) {
    isYearFound = true;
    }
    i++;
    }
    if (!isYearFound) {
    var option = document.createElement("option");
    option.setAttribute("value", fullYear);
    var text = document.createTextNode(fullYear);
    option.appendChild(text);
    document.getElementById("cal1yearselect").appendChild(option);
    }
    YAHOO.util.Dom.get("cal1yearselect").value = fullYear;
    };
    YAHOO.util.Event.addListener(window, "load", cal1Init);
    YAHOO.util.Event.addListener("cal1dateselect", "click", changeDate);
    //]]>
    </script>
    <!-- FIN DE PARTE 2 -->








Agora vá até "Elementos de página", clique em "Adicionar um elemento de página" e clique em HTML/Javascript, e cole o segundo código.

Pegar 2º código




    <div id="cal1wrapper">
    <div id="cal1select">
    <select id="cal1monthselect" name="cal1monthselect">
    <option value="0"/>Janeiro
    <option value="1"/>Fevereiro
    <option value="2"/>Março
    <option value="3"/>Abril
    <option value="4"/>Maio
    <option value="5"/>Junho
    <option value="6"/>Julho
    <option value="7"/>Agosto
    <option value="8"/>Setembro
    <option value="9"/>Outubro
    <option value="10"/>Novembro
    <option value="11"/>Dezembro
    </select>
    <select id="cal1yearselect" name="cal1yearselect">
    <option value="1995"/>1995
    <option value="1996"/>1996
    <option value="1997"/>1997
    <option value="1998"/>1998
    <option value="1999"/>1999
    <option value="2000"/>2000
    <option value="2001"/>2001
    <option value="2002"/>2002
    <option value="2003"/>2003
    <option value="2004"/>2004
    <option value="2005"/>2005
    <option value="2006"/>2006
    <option value="2007"/>2007
    <option value="2008"/>2008
    <option value="2009"/>2009
    <option value="2010"/>2010
    <option value="2011"/>2011
    <option value="2012"/>2012
    <option value="2013"/>2013
    <option value="2014"/>2014
    <option value="2015"/>2015
    <option value="2016"/>2016
    <option value="2017"/>2017
    <option value="2018"/>2018
    <option value="2019"/>2019
    </select>
    <input id="cal1dateselect" value="-->" type="button"/>
    </div>
    <div id="cal1Container"><img style="vertical-align:middle;
    " src="http://img239.imageshack.us/img239/9057/40lf8.gif"/&gt; Carregando...</div>
    <div style="clear:both;"></div>
    <div id="calbackloadimg">
    <pre id="cal1loadimg" style="display:none;"><img style="vertical-align:middle;" src="






Agora pegue este 3º código, volte ao HTML do seu blog e cole antes de : ]]></b:skin>
o código abaixo, para que não apareçam as postagens abaixo do calendário. *OPCIONAL



#calbackloadimg{
display:none;
}

2 comentários:

  1. Oii!
    Adorei seu Template espero que continue melhorando mais do que já está.Peguei um template para minha filhinha.

    ResponderExcluir

A legislação brasileira prevê a possibilidade de se responsabilizar o blogueiro pelo conteúdo do blog, inclusive quanto a comentários; portanto, o autor deste blog reserva a si o direito de não publicar comentários que firam a lei, a ética ou quaisquer outros princípios da boa convivência. Não serão aceitos comentários anônimos ou que envolvam crimes de calúnia, ofensa, falsidade ideológica, multiplicidade de nomes para um mesmo IP ou invasão de privacidade pessoal / familiar a qualquer pessoa. Comentários sobre assuntos que não são tratados aqui também poderão ser suprimidos, bem como comentários com links. Este é um espaço público e coletivo e merece ser mantido limpo para o bem-estar de todos nós.


Copyright © Templates e Acessórios |
Design by Elke di Barros | Tecnologia do Blogger
    Twitter Facebook Google + YouTube