Passa ai contenuti principali

Aggiungere sidebar in blogger.

A tutti voi ecco un altro trucchetto per modificare il nostro blogg, con piattaforma blogspot.
Come prima cosa quando siete su modifica modello html, scaricate e salvate una copia del template non si sa mai vada storto qualcosa.

A tutti voi ecco un altro trucchetto per modificare il nostro blogg, con piattaforma blogspot.
Come prima cosa quando siete su modifica modello html, scaricate e salvate una copia del template non si sa mai vada storto qualcosa.
Ora scrollate fin giu nel codice, fermatevi quando trovate il codice:

Non vi spaventate se non trovate i tag >b:widget id="HTML2" come i miei non sono importanti, l'importanete è che selezionate dall apertura del tag >div id="sidebar-wrap"> fino alla sua chiusura.ok!
Bene ora copiate e incollate tutto il codice un po più sopra esattamente:

Qui fermatevi e alla fine di questo codice, INCOLLATE.
Se volete la side bar a sinistra, perchè il codice che vedte qui sopra si riferisce all'header del vostro blog, quindi incollando il codice subito dopo la sidebar viene caricata a sinistra, se invece volete la side bar a destra, un po piu giu al codice trovate questo div

>div id='main-wrap1'> >div id='main-wrap2'>
>b:section class='main' id='main' showaddelement='no'>
>b:widget id='Blog1' locked='true' title='Post sul blog' type='Blog'/>
>
>/b:section>
>/div> >/div>

andate subito alla fine di questo div e incollate il codice .


SECONDO PASSO
Copiate questo codice

>div id='left-sidebar-wrapper'>
>div id='sidebarbottom-wrap1'> >div id='sidebarbottom-wrap2'>
>b:section class='sidebar' id='left-sidebar' preferred='yes'>

e incollatelo nel codice appena incollato su, precisamente al posto di queste righe:

come avrete notato, il codice appena incollateo ha i tag di apertura al contrario sono in rosso.. mettetteli a posto. <. Ora andate nel codice quasi all' inizio sopra, esattamente qui:
#sidebar-wrap {
width:240px;
float:right;
margin:15px 0 0;
font-size:97%;
line-height:1.5em;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

Fermatevi, e alla fine di questo codice, copiate e incollate questo:

#left-sidebar-wrapper {
width: 240px;
float: left;
word-wrap: break-word;
overflow: hidden;
}

Ora tornate nel codice qui:

>div id='left-sidebar-wrapper'>
>div id='sidebarbottom-wrap1'> >div id='sidebarbottom-wrap2'>
>b:section class='sidebar' id='left-sidebar' preferred='yes'>

e cancellate tutti i tag contenenti i widget
>b:widget id='HTML30' locked='false' title='LINK AMICI' type='HTML'/>
Non è detto che siano tutti HTML30 voi cancellate lo stesso, ma lasciate solo uno con HTML nel caso non lo avete copiate e incollate il codice sopra. Questo vi aiutera a capire nella visualizzazione in modalita elementi pagina. RICORDO DI CAMBIARE I TAG DI APERTURA DA >a<. ULTIMO PASSO Tornate un po su nel codice nella parte css e cercate:
#outer-wrapper {
background:...;
width:...;
margin:...;
text-align:...;
font:...;
}

e nalla riga width:...; aumentate di 220px il valore (es: width:700px; diventa width:920px;).
Ora salvate il modello. E visualizate in elementi pagina, dovreste vedere l'elemento HTML che abbiamo lasciato nel codice widget provate a scriverci qualcosa salvate e date un occhiata al blog. FUNZIONA? nel caso non dovesse funzionare aprite il modello salvato all'inizio con un semplice editor testo copiate e incollate tutto nel codice del template del vostro blog. Se volete una mano non esitate a postare.
Alla prox

Commenti

  1. ciao..ti ho aggiunto al mio blog con piacere..se hai qualke consiglio per la grafica del mio blog l'accetto volentieri..io ne capisco poco di html :(

    www.mark-be.blogspot.com

    RispondiElimina
  2. scusami,vorei aggingere la sidebar ma non è molto chiaro il post..al punot 1 e al termine del punto 2..puoi darmi una mano

    RispondiElimina
  3. si certo ma dove nn ti è chiaro? basta copiare il codice che devi trovare all inizio sidebar-wrapper, tutto dall apertura alla chiusura, e te lo duplici subito sottoheader wrapper,e poi lo stesso con lo stile relativo al div sidebar-wrapper te lo duplichi e cambi il relativo nome con questo div id='left-sidebar-wrapper'..mi sembra chiaro..se hai difficolta ci sentiamo . incollami il codice che nn ti è chiaro ma ricorda di togliere il tag di apertura nei post..saluti

    RispondiElimina
  4. mi spiace ma non è molto chiara come guida

    RispondiElimina
  5. e lo so mi dispiace ma se nn sai fare col codice tutto ti risulta difficile, io dò consigli e idee poi sta a voi a personalizzarli per il vostro blog, anche perche il codice cambia da template a template quindi, non ci posso fare niente..ciao

    RispondiElimina
  6. Scusa se approfitto di te, chissà se puoi aiutarmi, nel senso che quello che mi puoi dire sarà alla mia portata;)
    In un blog a cui mi sto dedicando da pochissimo vorrei fare quest apiccola modifica: infatti non vorrei cambiare template perchè mi sta bene quasi tutto delle caratteristiche del mio, tranne che vorrei evidenziare i titoli della colonnina a destra (dove metto foto,animazioni ecc.) con un colore tipo albicocca (stile quello standard di Word 2003 che uso).

    Io uso blogspot/blogger, Thisaway Blue mi pare il template, uno di quelli a scelta.
    In un altro template che però non mi piace questa opzione c'è...non è che sapreste guardare il codice per me e indicarmi se l'aggiunta/modifica è cosa da poco o stravolge tutta la base?
    Al limite se mi dite almeno come si chiamano i titoli della colonnina a destra...slidebar?Boh!
    Proverò a pasticciare col codice facendo le prove ma prima è meglio che raccolga qualche informazione base o proprio lasci perdere...dimmi qualcosa tu ti prego traducendo terra-terra...!
    Ciao e grazie
    Alessia
    Al limite ti mando il codice, ma non vorrei strafare e intasare..

    RispondiElimina
  7. ciao dalla mia breve ricerca, fatta in due minuti dovrebbe essere questa pate di codice riguardante il codice css:
    #sidebartop h2 {
    line-height:1.5em;
    color:$topSidebarHeaderColor;
    border-bottom: 1px dotted $topSidebarHeaderColor;
    margin-bottom: 0.5em;
    font: $headerFont;
    }
    ma a quanto pare il colore si cambia dalle impostazioni che trovi in modifica layout caratteri e colori..prova a vedere e dimmi..comunque la colonna si chiama sidebar..nel caso prova ad andare ad intuito nel codice ma se nn sei esperta devi stare attenta potresti perdere tutto..quindi prima di fare modifiche scaricati una copia del template..ciaoo

    RispondiElimina
  8. ciao, mi potresti dire come faccio ad aggiungere una casella di ricerca come la tua (nel senso che cerca nei post del blog e non sul web come la ricerca di google)? grazie mille. davide

    RispondiElimina
  9. certo vanilla ecco il link..http://elektrojoke.blogspot.com/2007/10/inserire-ricerca-nel-proprio-blog-o.html
    mi farebbe piacere se cliccasi su segui in alto sulla colonna destra..grazie mille..

    RispondiElimina

Posta un commento

Post popolari in questo blog

Come inserire post correlati con miniature, su blogger, blogspot con linkwithin.com

Con questo splendido sito, abbiamo la possibilità di inserire i post o articoli correlati con miniature sui nostri blog, di qualsiasi piattaforma,blogger, blogspot e wordpress ci basterà andare qui: www.linkwithin.com sulla destra troveremò 4 campi in cui dobbiamo inserire la nostra email, l'indirizzo del nostro blog, la piattaforma e il numero di post correlati da visualizzare, saremo diretti ad una schermata dove con un semplice click inseriremo il widget dei post correlati nel nostro blog nella posizione che vogliamo.

Come eliminare la fastidiosa pubblicità di youtube

Quanto è noiosa la pubblicità di youtube mentre guardiamo i video? Da oggi per eliminare le pubblicità dai video di youtube , almeno su google chrome  basta installare il plugin ScrewAds Plus for YouTube e attivarlo. Per scaricare ScrewAds Plus for youtube e bloccare le pubblicità dei video di youtube basta andare sullo store di google e cercare SCREWADS FOR YOUTUBE . Una volta installato il plug in ed attivato noteremo come le pubblicità nei video di youtube vengono bloccate .

Cambiare MAC address al nostro mac OSX

Ecco un bel programmino che permette di cambiare il nostro MAC address al nostro mac OSX. MacDaddy è uno spoofer , cioè un applicazione che permette di cambiare l'indirizzo MAC address associato al nostro dispositivo di rete, scheda di rete, può generare un MAC Address legato ad un produttore, oppure in modo totalmente casuale. Appena cambiato il MAC address basta un riavvio di computer è il gioco è fatto. Utilissima utility per raggirare parecchie cose..  ;-) MacDaddy download

Serrature a Doppia Mappa vs. Serrature a Cilindro Europeo: Qual è la Differenza e Qual è la Migliore Scelta?

  Quando si tratta di sicurezza domestica, le serrature svolgono un ruolo fondamentale. Due tipi comuni di serrature utilizzate sono le serrature a doppia mappa e le serrature a cilindro europeo. Ma qual è la differenza tra queste due opzioni e quale dovresti scegliere per proteggere al meglio la tua casa? Serrature a Doppia Mappa Le serrature a doppia mappa sono uno dei tipi più tradizionali di serrature utilizzate nelle porte di molte case. Queste serrature richiedono due chiavi differenti per essere aperte. Hanno due insiemi di alette interne, che devono essere allineate con precisione dalle chiavi per consentire l'apertura. Vantaggi delle Serrature a Doppia Mappa : Sicurezza : Le serrature a doppia mappa sono note per la loro resistenza agli attacchi, come l'effrazione. Affidabilità : Sono robuste e durature, richiedendo una manutenzione minima nel corso del tempo. Svantaggi delle Serrature a Doppia Mappa : Chiavi Agganciate : Il principale svantaggio è che le chiavi posson...

Come scaricare video da rai replay

Smanettando sono riuscito a trovare il metodo per scaricare i video dal sito della rai raireplay, ecco il procedimento che non sempre funziona, bisogna far passare alcuni giorni e riprovare, di solito passano 4 o 5 giorni prima di trovare il link. 1- Svuotare la cache di explorer 2- da explorer navigare il sito della rai sezione raireplay, scegliamo giorno e canale del programma che ci interessa.  3- Ora andiamo a questo percorso nella cartella dei file temporanei di explorer: C:\Documents and Settings\[VOSTRO NOME]\Impostazioni locali\Temporary Internet Files Se avete Vista o Seven in genere è C:\Users\[VOSTRO NOME]\AppData\Local\Microsoft\Windows\Temporary Internet Files\Content.IE5\ 4-All'interno di tale cartella dovremmo trovare anche il un file con il nome che varia con la data ad esempio: RaiCinque_2012_07_20[3] tale file ha estensione html 5- non ci resta che aprire il file con notepad++ e cercare il nome del programma che ci interessa, possiamo aiutarci con la co...

Cocktail - comandi e funzioni nascoste del Mac

Quando si usa un sistema operativo come Mac Os oppure Linux, molti comandi e funzioni possono essere eseguiti solo da riga di comando. Eseguirli è abbastanza noioso, ma soprattutto non sono accessibili a tutti coloro che non sono utenti esperti. Inoltre molte funzioni vanno svolte periodicamente poichè sono molto utili al funzionamento del proprio computer. Gli utenti Mac ovviamente sono, come al solito, privilegiati, infatti per il sistema operativo della mela, esiste un'applicazione molto utile, che permette di svolgere quelle funzioni accessibili solamente da riga di comando in maniera semplice con la possibilità di farle periodicamente in maniera automatica. Il suo nome è Cocktail, della quale è stata sviluppata la versione 4.6, compatibile anche con Snow Leopard. Il software offre alcune funzionalità aggiuntive di QuickTime, come i comandi per i sottotitoli o la possibilità di registrazioni in contemporanea. Inoltre si possono programmare funzionalità periodiche come la pu...

Aggiungere anteprima del post, in blogger

Un piccolo difetto della piattaforma blogger e quella che ci mostra l'intero contenuto di ogni post nella pagina, rallentando a volte il caricamento della pagina. Grazie a Ramani Un piccolo difetto della piattaforma blogger e quella che ci mostra l'intero contenuto di ogni post nella pagina, rallentando a volte il caricamento della pagina. Grazie a Ramani 1 passo impostazioni, modifica modello html, scarichiamo e salviamo una copia del template non si sa mai. Espandi widget, e incominciamo: Aggiungere il seguente codice JavaScript. Appena sopra il tag </head>: <script type='text/javascript' src='http://www.anniyalogam.com/widgets/hackosphere.js' /> 2 passo cercate il tag b:includable id='post', nel vostro modello e modificatelo in modo tale che sia esattamente come quello di seguito,(il codice in rosso, si deve aggiungere): <b:includable id='post' var='post'> <div class='post'> <a expr:name='data:pos...

La casa del grande fratello, ecco come vederla con google earth

Nella rete si trovano moltissimi appassionati del Grande Fratello , e molti di loro si chiedono se è possibile vedere tramite Google Earth o con un qualsiasi altro programma, la casa dall’alto! Il programma Google Earth è sufficiente a mostrare dall’alto la casa del reality. La zona in cui si trova la casa Grande Fratello è Cinecittà a Roma, quindi basta inserire la via che si tratta di via tuscolana più o meno al numero mille oppure inserite il nome “Cinecittà” e cercate di trovare ad occhio gli studi televisivi, li usufruendo dello zoom potrete trovare e visionare la casa del gf.

Inserire foto degli utenti che commentano in blogger.

Pronti per un altra avventura? Vediamo come far apparire l'immagine del profilo degli utenti nei commenti. 1-prima di iniziare scaricate una copia del template. 2-modifica html, espandi widget. 3-Trovate il seguente codice <dl id='comments-block'> <b:loop values='data:post.comments' var='comment'> <dt class='comment-author' expr:id='"comment-" + data:comment.id'> <div class='commentphoto' style='float:right;'/> <a expr:name='"comment-" + data:comment.id'/> <b:if cond='data:comment.authorUrl'> <a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a> <b:else/> <data:comment.author/> </b:if> <data:commentPostedByMsg/> </dt> <dd class='comment-body'> <b:if cond='dat...

Installare tomcat su mac, installazione tomcat su mac osx

Ecco un tutorial dove spiega passo passo come installare tomcat su mac osx http://cb.linux.it/documenti/download/04-tomcat.pdf.gz nota: 1-Alla pagina 4 del tutorial per controllare che il file environment.plist sia stato creato bisogna digitare nel terminal la seguente riga e premere invio: cut .MacOSX/environment.plist dovrete avere come risultato la figura presente a pag 4 del tutorial 2-Col seguente comando ci rechiamo nella directory tomcat bin cd ~/Library/Tomcat/bin 3-ora lanciamo tomcat col comano ./startup.sh 4-Molto probabilmente avrtete errore tipo: startup.sh: Operation not permitted questo perchè nn abbiamo i permessi sul file 5-Digiatiamo chmod +x *.sh 6-Ridigitiamo ./startup.sh Notate bene che alla fine non ci sia la riga rossa come qui sotto: Using CATALINA_HOME: /Users/antoniopaciulli/Library/Tomcat Using CATALINA_TMPDIR: /Users/antoniopaciulli/Library/Tomcat/temp Using JRE_HOME: /Library/Java/Home touch: /Users/antoniopaciulli/Library/Tomcat/logs/catalina.out: ...