Αλλαξτε την εμφανιση της ημερομηνιας στις αναρτησεις του blog σας

Το πρωτο πραγμα που πρεπει να κανουμε ειναι να παμε στις ρυθμισεις - γλωσσα και ημερομηνια και να αλλαξουμε τo στυλ της ημερομηνιας σε  00 μηνας 0000 δηλαδη ετσι 22 Δεκ 2013.

Με αυτο το κολπο η ημερομηνια μας θα φενεται ετσι
Αλλαξτε την εμφανιση της ημερομηνιας


Mετα παμε επεξεργασια προτυπου και με control + f βρισκουμε αυτο το κωδικο


<h2 class='date-header'><span><data:post.dateHeader/></span></h2>


και τον αντικαθιστουμε με αυτον


<span class='date-header'><div id='date'> <script>replace_date(&#39;<data:post.dateHeader/>&#39;);</script> </div></span>

μετα  βρισκουμε αυτο το μικρουλι κωδικο


</head>
και απο κατω  του βαζουμε αυτον



<script> function replace_date(d) { var da = d.split(' '); day = "<div class='day'>"+da[0]+"</div>"; month = "<calendar class='month'>"+da[1].slice(0,3)+"</calendar>"; year = "<div class='year'>"+da[2]+"</div>"; document.write(month+day); } </script>

τελευταιο βημα ειναι να βαλουμε το κωδικα css οποτε βρισκουμε αυτο το κωδικουλη


]]> </b:skin>


και ακριβως απο πανω του βαζουμε αυτο


/* Date Style */
span.date-header {
margin-left: -60px; /* CHANGE POSITION */
width: 30px; /* CHANGE WIDTH */
height: 30px; /* CHANGE HEIGHT */
padding: 10px; /* CHANGE PADDING SPACE */
word-wrap: break-word;
float: left;
-webkit-border-radius: 10px; /* CHANGE RADIUS OF CIRCLE */
-moz-border-radius: 10px; /* CHANGE RADIUS OF CIRCLE */
-o-border-radius: 10px; /* CHANGE RADIUS OF CIRCLE */
border-radius: 10px; /* CHANGE RADIUS OF CIRCLE */
font-family: 'arvo'; /* CHANGE FONT */
text-align: center;
background-color: #fcfcfc; /* CHANGE BACKGROUND COLOUR */
background: linear-gradient(top, #fcfcfc 0%, #dad8d8 100%); /* CHANGE BACKGROUND GRADIENT */
background: -moz-linear-gradient(top, #fcfcfc 0%, #dad8d8 100%); /* CHANGE BACKGROUND GRADIENT */
background: -webkit-linear-gradient(top, #fcfcfc 0%, #dad8d8 100%); /* CHANGE BACKGROUND GRADIENT */
font-size: 10px; /* CHANGE FONT SIZE */
-webkit-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.1); /* CHANGE SHADOW */
box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.1); /* CHANGE SHADOW */
border: solid 1px #d2d2d2; /* CHANGE BORDER STYLE, WIDTH AND COLOUR */
}
#date {
display:block;
line-height:1.3em;
text-align:center;
}
calendar {
background: #d10000; /* CHANGE BACKGROUND */
background: linear-gradient(top, #d10000 0%, #7a0909 100%); /* CHANGE BACKGROUND GRADIENT */
background: -moz-linear-gradient(top, #d10000 0%, #7a0909 100%); /* CHANGE BACKGROUND GRADIENT */
background: -webkit-linear-gradient(top, #d10000 0%, #7a0909 100%); /* CHANGE BACKGROUND GRADIENT */
padding: 0px 10px 0px 10px; /* CHANGE PADDING SPACE */
position: absolute;
left: 0px;
top: 0px;
left: -1px;
right: -1px;
border-radius: 10px 10px 0px 0px; /* CHANGE RADIUS OF BORDER BOTTOM */
}
.day {
font-size:20px; /* CHANGE FONT SIZE OF DAY */
padding-bottom:1px; /* CHANGE SPACE UNDERNEATH */
text-shadow: 0px #666666; /* CHANGE TEXT SHADOW */
position: absolute;
top: 30px;
left: 0px;
right: 0px;
padding-top: 1px; /* CHANGE SPACE ON TOP */
letter-spacing:0px; /* CHANGE SPACE BETWEEN LETTERS */
text-align: center !important;
}
.month {
padding-top:2.5px;
letter-spacing:3px; /* CHANGE SPACE BETWEEN LETTERS */
color: #FFFFFF; /* CHANGE FONT COLOUR*/
height:20px; /* CHANGE HEIGHT OF MONTH */
width:32px; /* CHANGE WIDTH OF MONTH */
}

ελπιζω να τα καταφερεται αλλιως αφηστε ενα σχολιο και αν μπορω θα σας βοηθησω

1 comments so far

ΜΕ ΛΙΓΟ ΠΕΙΡΑΓΜΑ ΤΩΝ ΧΡΩΜΑΤΙΚΩΝ ΚΩΔΙΚΩΝ ΓΙΝΕΤΑΙ ΟΠΩΣ ΤΟ ΘΕΛΕΙΣ ΕΜΦΑΝΙΣΙΑΚΑ.ΕΙΝΑΙ ΑΡΚΕΤΑ ΚΑΛΟ.Δείτε το.http://larissaios.blogspot.gr