[RISOLTO] Personalizzazione della struttura base dell'articolo

[giuxmian]

Buongiorno a tutti,

volendo fare una modifica alla struttura di default dell'articolo sono partito da questo link.

Partendo da questo, vorrei modificare la struttura dell'articolo inserendo uno spazio bianco come se si fosse premuto tre volte il tasto INVIO (oppure una immagine di default della stessa dimensione) in modo che l'utente, quando crea un nuovo articolo, inizi a scrivere subito sotto questo spazio. Allego una immagine a titolo esemplificativo.

Collegata a questa richiesta, porgo un'altra domanda: è possibile fare in modo che il titolo dell'articolo (che nell'immagine allegata è stato riportato a mano con un semplice copia e incolla) venga visualizzato in automatico sotto lo spazio vuoto precedentemente impostato?

Chiedo a chi è più esperto di me se sapesse indicarmi qual è la modifica di codice da fare (se fattibile, naturalmente).

Spero di avere spiegato bene la mia richiesta e grazie anticipatamente.

[giusebos]

domanda: a cosa serve lo spazio bianco?

[giuxmian]

Ciao Giusebos,

ho un main menu che, facendo lo scroll delle pagine verso il basso, deve rimanere bloccato in alto (link).

Quando vengono creati gli articoli, una volta aperti il testo ed il titolo vengono nascosti dal blocco del main menu che rimane fisso, per cui l'unica opzione è di far scalare verso il basso il testo.

"Artigianalmente", cioè a mano, dando 3-4 invii riesci ad aggirare il problema, tuttavia l'utente (ci sono 4 persone che saranno dedicate alla scrittura di articoli, una per ogni area) può dimenticarsi di questo e quindi o me ne accorgo oppure l'articolo viene tagliato in alto nella parte del main menu e bisogna intervenire successivamente.

Ecco perchè avevo pensato ad intervenire con la modifica che ho descritto nel post.

[giusebos]

ho capito.
ma è molto più vantaggioso agire attraverso i css, spostando il div dell'articolo nella posizione più opportuna, così non avresti da inserire niente al momento di scrivere l'articolo.

[giuxmian]

Trovo la soluzione che hai proposto interessante, sapresti darmi una mano su come fare?



Se vuoi posso allegare il file php.

Grazie

[giuxmian]

Scusa, volevo dire CSS

[giuxmian]

Sai dirmi quale sia il file CSS da modificare così lo cerco?

Grazie.

[giusebos]

occorre un link al tuo sito per poterti aiutare in maniera specifica.
Se fosse in locale ti consiglio di pubblicarlo.

[giuxmian]

Ciao Giusebos,

lo avevo postato sopra all'interno di un collegamento ipertestuale ma te lo scrivo: http://www.consorziodesiobrianza.it/sitopro

[giusebos]

Bene

dammi però un un link con un articolo di riferimento

[giuxmian]

Perdonami, hai ragione. Provvedo subito.

http://www.consorziodesiobrianza.it/sitopro/index.php?option=com_content&view=article&id=134

[giusebos]

non riesco a replicare il problema perchè forse c'è poco testo

[giusebos]

poi vedo che hai usato delle tabelle all'interno dell'articolo e molti stili in linea.....

Visto accessibilità del sito dovresti eliminare questi stili ed usare le tabelle proprio dove non se ne puà fare a meno (liste e dati tabellari)

ad ogni modo per spostare verso il basso l'area content, quella con contenuti e titolo, aggiungi queste righe in fondo al file

consorziodesiobrianza.it/sitopro/templates/at_tahoma/css/template.css

.at-item-page p:first-child {
   margin-top: 50px;
}

ma senza un adeguata pulizia del codice in linea potresti non avere l'effetto desiderato.....rivedi la formattazione, modificando le regole nel css

[giuxmian]

Ciao Giusebos,

esattamente, man mano devo fare anche queste correzioni proprio per il discorso dell'accessibilità.

Sono riuscito a trovare questi due articoli che riproducono il problema che ho descritto nel post; vedrai i titoli (inseriti con il copia & incolla) che sono parzialmente nascosti dal main menu.

http://www.consorziodesiobrianza.it/sitopro/index.php?option=com_content&view=article&id=108

http://www.consorziodesiobrianza.it/sitopro/index.php?option=com_content&view=article&id=109

[giusebos]

il fatto è che con quegli stili in linea ti sei fottuto l'accessibilità

[giusebos]

visto gli altri link e la regola che ti proponevo non va bene....

[giusebos]

se disabiliti l'editor ti accorgerai di quanto disordine c'è......

se mi apri una pagina di test ti do del codice che formatteremo con i CSS

[giuxmian]

il fatto è che con quegli stili in linea ti sei fottuto l'accessibilità

se disabiliti l'editor ti accorgerai di quanto disordine c'è......

sono articoli importati dalla precedente versione del sito che necessitano di manutenzione.

se mi apri una pagina di test ti do del codice che formatteremo con i CSS

vuoi che ti crei un utenza base per accedere in back-end?

[giusebos]

anzi se per te va bene, incolla il seguente codice,  nella pagina
http://www.consorziodesiobrianza.it/sitopro/index.php?option=com_content&view=article&id=109

Prima però disabilita l'editor

Codice: [Seleziona]

<h3>Servizio offerto</h3>
<p>Il Servizio ASH supporta, attraverso l’intervento degli educatori, i percorsi scolastico-formativi degli alunni con disabilità per favorirne i processi di inclusione. </p>

<h3>I destinatari </h3>
<p>Persone disabili inserite in servizi educativi (asili nido comunali), di formazione e istruzione.   </p>

<h3>Modalità di accesso </h3>
<p>La richiesta di attivazione degli interventi educativi è inoltrata con la documentazione necessaria dagli Istituti Scolastici al Comune di residenza dell’alunno. </p> <p>

Di norma, in caso di prima richiesta è chiesto di allegare la certificazione ai sensi del DPCM 185/2006, la Diagnosi Funzionale o la precedente documentazione BH–DF ed eventuale altra documentazione ritenuta utile.</p> <p>

La richiesta è condivisa con le famiglie. </p> <p>

I tecnici del CDB e quelli del servizio sociale o dell’ufficio pubblica istruzione comunali ed altre figure coinvolte all’occorrenza (es. NPI, terapisti altre figure specialistiche) svolgono una prima valutazione della richiesta e una prima ipotesi di intervento. </p> <p>

Definito il Progetto Personalizzato e le ore di intervento settimanali, si  procede a comunicarlo alle scuole richiedenti. </p> <p>

La durata del progetto è annuale, coincidente con l’anno scolastico, al termine del quale si valuterà se proseguire o concludere l’intervento.     </p> <p>

<h3>Erogazione del servizio
<p>Il servizio è erogato nelle scuole frequentate dai destinatari dell’intervento; gli educatori sono dipendenti di una Cooperativa esterna, incaricata tramite appalto. </p> <p>

I referenti della Cooperativa sono in continuo contatto con il Responsabile SID.   </p>

<h3>Costi</h3>
<p>Il Servizio è sostenuto dai Comuni. </p>

 

<h3>Responsabile</h3>
<p>Responsabile del servizio: Davide Biggi telefono 0362 391761 dal lunedì al venerdì  </p>

<h3>Dove </h3>
<p>La sede dell’ufficio S.I.D. si trova presso l'A.S.C. Consorzio Desio-Brianza - Via Lombardia 59 - 20832 Desio (MB)</p>

<h3>Segreteria Servizi alla Persona  </h3>
<p>Le referenti amministrative sono disponibili telefonicamente al numero 0362 391731 dal lunedì al venerdì dalle ore 9.00 alle ore 16.00[br /]
E-mail: sid@codebri.mb.it  </p>

con questa pagina pulita daremo la giusta grandenza al font e i giusti margini

[giusebos]

vuoi che ti crei un utenza base per accedere in back-end?

No, non voglio che diventi un aiuto at personam, ma desidero che anche altri seguano per poter imparare e applicare le modifiche nel loro sito.

[giuxmian]

No, no, ci mancherebbe. Non avevo capito io se mi avevi chiesto quella cosa.

Ho fatto e salvato.

EDIT: come editor utilizzo JCE ma come mi hai suggerito per ora l'ho disabilitato.

[giusebos]

per prima cosa sistemiamo il titolo che non c'è.......
perchè riscriverlo nel corpo quando possiamo utilizzare quello vero?

controlla nelle opzioni dell'articolo che il titolo sia visibile, oppure nelle opzioni della categoria

[giusebos]

per sistemare la grandezza del font inserisci in fondo al file

Codice: [Seleziona]

consorziodesiobrianza.it/sitopro/templates/at_tahoma/css/template.css
le seguenti righe:

Codice: [Seleziona]

.item-page p {
    font-size: 12px;
    text-align: justify;
}


[giusebos]

Poi (se vuoi) diamo un tocco di classe ai titoletti aggiungendo sempre nello stesso file:

Codice: [Seleziona]

.item-page h3 {
color: #1270B8;
}
i titoletti saranno dello stesso blu dello sfondo in alto

[giusebos]

nel frattempo aspetto la comparsa del titolo ti do il codice per evidenziare l'area in fondo con le INFO

disabilitando l'edito aggiungerai

Codice: [Seleziona]

<div class="alert alert-info" role="alert">
prima di

Codice: [Seleziona]

<h3>Responsabile</h3>
e inserirai

Codice: [Seleziona]

</div>dopo di

Codice: [Seleziona]

E-mail: sid@codebri.mb.it  </p>
aggiungendo questa classe utilizzeremo uno dei tanti stili di bootstrap, stili presenti in quanto il tuo template usa bootstrap.
Quindi per questo non sarà necessario aggiungere nessuna riga al css.

In seguito dovrai ricordarti di inserire la classe prima e dopo il blocco info o qualsiasi altro blocco che vorrai evidenziare.

Ti dico anche che cambiando la classe si cambia il colore...qui più info
http://bootstrapdocs.com/v3.3.4/docs/components/#alerts

[giuxmian]

Ciao Giusebos,

ho applicato i tuoi suggerimenti e sono stati straordinariamente utili ed interessanti!! Quindi davvero grazie.

Ho alcune cose da chiederti:


1) ho visto che in fondo all'articolo mi crea uno sfondo rosso.
La pagina deve essere neutra senza nessuno sfondo colorato quindi ho tolto la parte di codice

Codice: [Seleziona]

<div class="alert alert-info" role="alert"> che mi hai indicato nell'ultimo tuo commento.

2) L'editor JCE lo devo tenere disabilitato?

3) Ho impostato il titolo come visibile e tutto l'articolo su cui abbiamo lavorato è esattamente come volevo.
Per quanto riguarda i futuri articoli che verranno creati dalle altre persone (utenti base-base-base) devo(no) fare qualcosa oppure è sufficiente che scrivano e basta? Te lo chiedo perchè ho provato a creare un articolo di prova (sotto menu Azienda, titolo XXX) ma lo vedo con il titolo nascosto.

4) Per gli articoli già esistenti come mi devo comportare? Immagino che debbano essere "ripuliti".
Ne ho preso un altro a caso http://www.consorziodesiobrianza.it/sitopro/index.php?option=com_content&view=article&id=117
e vedo il titolo che dovrebbe essere a posto (devo togliere gli spazi), una parte di testo normale ed un altra parte molto più piccolo (tra cui il testo della normativa privacy). Come posso fare a "ripulire" gli articoli come hai fatto tu con l'articolo su cui abbiamo lavorato?

Grazie mille

[giusebos]

1) ho visto che in fondo all'articolo mi crea uno sfondo rosso.
La pagina deve essere neutra senza nessuno sfondo colorato quindi ho tolto la parte di codice

Codice: [Seleziona]

<div class="alert alert-info" role="alert"> che mi hai indicato nell'ultimo tuo commento.

Togli anche il div di chiusura, questo

Codice: [Seleziona]

</div>

2) L'editor JCE lo devo tenere disabilitato?

Come ti sembra meglio, ma se metterai a disposizione tutti quegli strumenti, i tuoi editor, in senso di scrittori, non resisteranno e vorranno formattare il testo come più gli parrà senza attenersi allo standard che hai voluto dargli e sopratutto compromettendo l'accessibilità, che detto tra noi, in quel sito vi è solo in parte.

3) Ho impostato il titolo come visibile e tutto l'articolo su cui abbiamo lavorato è esattamente come volevo.
Per quanto riguarda i futuri articoli che verranno creati dalle altre persone (utenti base-base-base) devo(no) fare qualcosa oppure è sufficiente che scrivano e basta? Te lo chiedo perchè ho provato a creare un articolo di prova (sotto menu Azienda, titolo XXX) ma lo vedo con il titolo nascosto.

Devi fare in modo che tutti gli articoli abbiano il titolo visibile, questo lo puoi fare dalle opzioni in articoli, mentre articolo per articolo le impostazioni devono essere tutte su "default".
Probabilmente ti sei portato dietro, durante la migrazione, le vecchie errate impostazioni.
L'unico articolo che solitamente non ha un titolo è quello in home page e quelli dove nel content contengono un modulo.

4) Per gli articoli già esistenti come mi devo comportare? Immagino che debbano essere "ripuliti".
Ne ho preso un altro a caso http://www.consorziodesiobrianza.it/sitopro/index.php?option=com_content&view=article&id=117
e vedo il titolo che dovrebbe essere a posto (devo togliere gli spazi), una parte di testo normale ed un altra parte molto più piccolo (tra cui il testo della normativa privacy). Come posso fare a "ripulire" gli articoli come hai fatto tu con l'articolo su cui abbiamo lavorato?

Qui tocca usare quella cosa chiamata "olio di gomito". Purtroppo chi ha creato i vecchi articoli non aveva idea di quale danno stesse facendo.......

la formattazione per gli articoli con i tag html è talmente semplice che varrebbe la pena di spiegarlo:
usare solo h2, h3 e h4, ed usare il tag p "paragrafo, altro non direi......vedrai che anche l'utente più smanettone non si metterà a fare casini.

[giuxmian]

Devi fare in modo che tutti gli articoli abbiano il titolo visibile, questo lo puoi fare dalle opzioni in articoli, mentre articolo per articolo le impostazioni devono essere tutte su "default".
Probabilmente ti sei portato dietro, durante la migrazione, le vecchie errate impostazioni.
L'unico articolo che solitamente non ha un titolo è quello in home page e quelli dove nel content contengono un modulo.

Ciao Giusebos,

intanto grazie per i tuoi suggerimenti.

Per l'articolo di prova che avevo creato è tutto a posto, il titolo si vede correttamente.
Nelle impostazioni generali avevo già impostato che il titolo fosse visibile.

Ho notato una cosa; siccome ho legato il menu Home ad un articolo vuoto (titolo: Blank), vedo il titolo nonostante abbia impostato che questo articolo non debba visualizzarlo (allego immagine).

In questo caso come posso risolvere il problema?

Qui tocca usare quella cosa chiamata "olio di gomito". Purtroppo chi ha creato i vecchi articoli non aveva idea di quale danno stesse facendo.......
la formattazione per gli articoli con i tag html è talmente semplice che varrebbe la pena di spiegarlo:
usare solo h2, h3 e h4, ed usare il tag p "paragrafo, altro non direi......vedrai che anche l'utente più smanettone non si metterà a fare casini.

Che fosse necessario olio di gomito lo avevo già messo in preventivo…cercavo di capirne la quantità da usare 

Per quanto già presente devo metterci le mani io, quindi partivo dall’articolo che abbiamo visto insieme per chiederti se hai utilizzato un qualche strumento in grado di ripulire il testo e renderlo ottimale ottenendo il miglior rapporto tra semplicità ed utilizzo del minor tempo possibile (come al solito le cose sono chieste a stretto giro...).

Per il futuro, invece, data la barra di formattazione di JCE ho ristretto le possibilità di scelta a quello che vedi nel file allegato; secondo te devo fare ancora qualche limatura, per esempio togliendo alcuni pulsanti (es. tabelle, inserimento caratteri, ecc.), oppure va bene così?

Grazie mille!!

[giusebos]

nella voce di menù, tra le opzioni troverai come nascondere il titolo dell'articolo,
mentre per l'editor elimina la possibilità di scegliere il font, la dimensione ed il colore.

per la ripulitura degli articoli non sono a conoscenza di strumenti specifici per joomla.
Quindi ti consiglio di aprire un post specifico con titolo chiaro in maniera da catturare l'attenzione di chi ha avuto lo stesso tuo problema.

[giuxmian]

nella voce di menù, tra le opzioni troverai come nascondere il titolo dell'articolo,
mentre per l'editor elimina la possibilità di scegliere il font, la dimensione ed il colore.

Verificato e fatto.

Intanto grazie per il prezioso supporto che mi hai dato, ora apro un altro post per la seconda parte della tua risposta.