Utilizzando l’ultima versione stabile di Discourse (3.2.x) più la versione aggiornata dei componenti Landing Pages (plugin, pagine blog e tema blog) sono riuscito solo a riprodurre i problemi di sfondo dell’immagine e delle dimensioni del contenitore dei post. Apporterò un piccolo aggiornamento al tema non appena potrò, ma sono facilmente risolvibili se vuoi farlo nel tuo fork.
Utilizzando le impostazioni predefinite in un’installazione pulita, i pulsanti Posts/Subscribe si trovano in fondo alla pagina ed entrambi funzionanti, i percorsi nella versione mobile si comportano allo stesso modo di quelli desktop e non riesco a verificare alcun problema con le date dei post, ad eccezione dell’“ultimo aggiornamento” che cambia una volta impostata la categoria del blog (tutti i post in quella categoria ricevono un tag “post del blog”).
Il menu hamburger nella versione mobile sarà vuoto finché non avrai configurato qualcosa nelle impostazioni “Menu” della configurazione delle landing pages. Potrei aggiornare il codice per nasconderlo completamente in quella situazione per semplificare l’interfaccia.
Ho appena raggiunto il tuo blog e ho potuto rapidamente correggere alcune cose:
Per quanto riguarda il pulsante che non funziona, sembra che tu abbia abilitato alcune impostazioni rigide di Content-Security Policy e che gli script richiesti non vengano caricati.
Per quanto riguarda i link, ho appena acceduto al tuo sito usando Firefox su un telefono Android e non ho riscontrato alcun problema. Forse un’altra configurazione particolare del tuo browser o dell’installazione di Discourse?
Per quanto riguarda le correzioni CSS ci sono molte opzioni. Ad esempio, per l’immagine di sfondo puoi impostare background: no-repeat center/cover fixed; nella classe .title-container all’interno di common.scss, e per il “piccolo contenitore” nei post puoi aggiungere min-width: 100%; alla classe .post-content all’interno dello stesso file.
Per quanto riguarda l’impostazione del menu, attualmente l’unico modo per aggiungerne uno è nel file globale pages.json come menzionato nella documentazione ma non ci sono molte informazioni a riguardo. Puoi tuttavia vedere un esempio nel repository pavilion-landing-pages.
Ehi! Quindi, nel video che hai registrato, gli URL diretti funzionano bene. Ma se vado alla pagina principale del blog e poi clicco sul titolo del blog, ottengo un errore di pagina non trovata. Gli URL diretti funzionano bene, ma nessuno li avrebbe a portata di mano e ovviamente non è praticabile.
Proverò subito quelle correzioni CSS e modificherò questo o risponderò di nuovo con i miei risultati, grazie!
Scoperta molto interessante sulla questione della Content-Security Policy… non ricordo nemmeno di aver fatto qualcosa al riguardo. Hmm. Come potrei risolvere questo problema?
MODIFICA: Ho risolto il pulsante Iscriviti disabilitando la content security policy nelle impostazioni. Ma c’è un modo per mantenerla abilitata ma far funzionare comunque il pulsante? Forse far funzionare il pulsante in modo diverso in modo che non la attivi?
Mi dispiace, non ho idea delle impostazioni CSP. Nel video, tra i 26 e i 27 secondi, faccio esattamente quello (clicco sul titolo del blog dalla home page dei blog) e ha ancora funzionato bene, quindi non sono sicuro di come testarlo ulteriormente da parte mia.
Modificato il mio post qui sopra per dire: “Corretto il pulsante Iscriviti disabilitando content security policy nelle impostazioni. Ma c’è un modo per mantenerlo abilitato ma far funzionare comunque il pulsante? Forse far funzionare il pulsante in modo diverso in modo che non lo attivi?”
E oh, colpa mia! Hm, allora è davvero strano. Ho provato più browser e persino alcuni telefoni e lo stesso problema…
A proposito, c’è un modo per rendere il pulsante/testo Iscriviti più grande per corrispondere alle dimensioni dell’icona “Post” che fluttua sullo schermo su mobile? L’icona ha le dimensioni corrette quando si è connessi a un account, ma non quando non si è connessi, come ospite, come puoi vedere nel tuo video.
Oltre a ciò, la mia unica altra cosa è rendere la foto del profilo/nome dell’autore, la data e l’area “Forum Topic” orizzontali su mobile poiché sembra brutto impilato verticalmente in questo modo (o almeno la data e l’area Topic una accanto all’altra, centrate sotto la foto del profilo o qualcosa)…
Oltre alla mia risposta precedente, @cabidop, il mio partner ha esaminato a fondo le pagine/temi del blog per un paio d’ore, perché volevo un parere da una persona generica e non tecnica sulla configurazione predefinita. Ho pensato di menzionarli qui se volessi incorporare qualcuno di questi nel materiale del blog:
Quando disconnesso, fai in modo che il pulsante Iscriviti sulla pagina di destinazione del blog riporti alla pagina di destinazione del blog dopo che un utente clicca su Iscriviti e crea un account sul sito.
Personalmente non mi ero nemmeno reso conto che funzionasse così, ma se un ospite clicca su Iscriviti, viene portato alla pagina di registrazione del forum e poi, quando crea un account, si ritrova a chiedersi dove sia la pagina del blog, dato che ti lascia sul forum. Tuttavia, quando ora torna alla pagina di destinazione del blog mentre è connesso, non è nemmeno iscritto e deve cliccare di nuovo sul pulsante mentre ora è connesso.
Ricevi un’e-mail di conferma che ti sei effettivamente iscritto.
Così com’è ora, non c’è una vera conferma che ti sei veramente iscritto via e-mail, solo il piccolo popup sulla casella popup Iscriviti.
Una volta iscritto, rimuovi completamente il pulsante mentre sei connesso, o fai in modo che dica “Iscritto” invece di “Iscriviti” sul desktop. Inoltre, fai in modo che i pulsanti non rimangano fissi sullo schermo durante lo scorrimento, ovvero scompaiano durante lo scorrimento.
La grande foto dell’intestazione nella pagina dei post del blog non viene trasferita su mobile. La mostra a malapena o a volte non la mostra affatto (foto qui sotto che mostrano Desktop VS mobile per questo):
Grazie per il feedback, @45thj5ej, potrei implementare alcuni dei suggerimenti come impostazioni predefinite in futuro. Non sono sicuro se hai già risolto il problema CSP, ma sembra che ci sia un’opzione content security policy script src che potrebbe funzionare per il tuo caso senza disabilitare completamente la funzionalità (anche se non ne sono del tutto sicuro).
Per quanto riguarda il tema che non funziona in altre pagine, questo è il comportamento previsto a causa dell’uso delle classi .blog e .blog-post negli stili. Ogni pagina di destinazione aggiunge il proprio slug come classe HTML al suo corpo, quindi finché gli stili CSS vengono applicati solo a quelle classi, influenzeranno solo le pagine “Blog” e “Blog Post” rispettivamente.
Per il resto dei commenti/problemi, ribadirei quanto menzionato nell’altro argomento riguardo alla specificità del tuo caso d’uso, poiché si tratta più di domande generali sui CSS che di problemi effettivi nel componente. Detto questo, potrei dare un’occhiata a questi in futuro (ma non darlo per scontato).
Ehi, una cosa piuttosto grave…
Ho configurato il mio Nginx per reindirizzare mysite.com a https://forums.mysite.com/home e ho impostato il record DNS A dal mio provider di dominio (poiché voglio che questa sia la pagina principale del mio sito).
Ho notato qualcosa di strano. Se accedo a un post del blog dal reindirizzamento (cioè, chiunque vada sul mio sito avrà questo problema), aggiunge una seconda /home all’URL. Tuttavia, se accedo alla home page del blog dall’URL diretto, https://forums.mysite.com/home, allora non lo fa.
C’è un modo per risolvere questo problema il prima possibile, o se me lo dici tu, posso farlo io. Questo è separato dal problema simile che si è verificato solo su mobile l’altro giorno. E, naturalmente, il link appare raddoppiato quando ci si passa sopra con il mouse nella home page del blog, come: https://forums.mysite.com/home/home/blog-test-one-million
Ma di nuovo, se accedo all’URL direttamente, non dal reindirizzamento, funziona bene.
Puoi verificare se il problema del “doppio percorso” si verifica solo con la pagina del blog, con qualsiasi landing page o con qualsiasi pagina di Discourse (ad esempio, /latest)?
Solo la home page/pagina di atterraggio del blog, dove si fa clic sui titoli dei post del blog.
.
MODIFICA: IGNORA QUANTO SEGUE. LA CORREZIONE È STATA:
Commentare l’unica riga sottostante in common.scss nel
tema del blog, intorno alla riga 172 circa:
body.blog {
/* padding-top: 8em; */
Inoltre, come modifico l’intestazione del sito? Sembra che non importa cosa faccia, l’intestazione viene sempre inserita lì e non riesco a modificarla affatto. L’area in alto con la barra di navigazione/menu/logo.
Esempio: ho creato un’intestazione personalizzata per rendere quella predefinita più corta. E anche usando
.landing-header {
display:none
}
crea ancora un grande spazio in alto. Come posso rimuovere quello spazio?
Ehi, @NateDhaliwal, so che la risposta arriva un po’ tardi ma non dovrebbero esserci problemi con l’estensione del blog (fammi sapere se diversamente).
