it-swarm-eu.dev

Sostituisci CSS globale nell'articolo

Ho un articolo in cui voglio applicare uno stile diverso da quello che è il globale.

Ho provato ad aggiungerlo in questo modo <link rel="stylesheet" type="text/css" href="https:"/ tag nella parte superiore del mio articolo, tuttavia non sostituisce il CSS globale.

È possibile sovrascrivere i CSS globali all'interno di questo articolo attraverso le impostazioni e applicare il mio? Come posso dare CSS speciali solo a questo articolo?

1
IcyPopTarts

Ci sono molte risorse in questo sito sull'override dei CSS. A seconda del modello e della configurazione generale del sito/pagina, potresti essere in grado di farlo semplicemente utilizzando un selettore css univoco che potrebbe esistere solo in quella pagina e aggiungere le tue regole css in un custom.css sul tuo modello.

Ad esempio, se colleghi quell'articolo con una voce di menu e il tuo css speciale è destinato solo al markup all'interno dell'articolo, puoi assegnare alla tua voce di menu una classe speciale (dall'interno della pagina di modifica delle voci di menu -> Scheda Visualizzazione pagina -> Campo Classe pagina ) e aggiungi i tuoi CSS nel custom.css file.

Se ad esempio aggiungi la classe special per quella voce di menu, allora nella tua custom.css puoi scegliere come target elementi all'interno del tuo articolo con:

.item-pagespecial h1 {
    color: red;
}

il .item-pagespecial Il selettore potrebbe essere la classe finale prodotta che verrà generata dal modello/override.


Risorse utili da leggere:

I seguenti link in questo sito potrebbero essere utili per studiare. Dai un'occhiata a:

2
FFrewin

Suppongo che TinyMCE rimuoverà quel tag perché non è valido nel corpo della pagina. Credo che non sia possibile impostare <link> come elemento valido in TinyMCE. Pertanto, se vai su Estensioni> Plugin e annulla temporaneamente la pubblicazione di TinyMCE, potrai accedervi utilizzando l'editor vuoto.

Se lo fai in questo modo, ti suggerirei di aggiungerlo alla pagina in un modulo CustomHTML e applicarlo invece alla pagina (questo approccio è possibile solo se l'articolo è collegato a una voce di menu), come salvare l'articolo usando TinyMCE in futuro rimuoverà sempre il tag.

Se questo non funziona, premi F12 e usa la tua console per assicurarti che il CSS sia effettivamente caricato (non è chiaro se lo stai caricando dal tuo sito. In caso contrario, potresti semplicemente non essere autorizzato a incorporarlo.)

Se è sulla pagina e si carica correttamente, assicurati che i tuoi stili vengano sovrascritti correttamente. Può darsi che non siano scritti in modo tale da avere la precedenza sui tuoi stili esistenti.

Infine, l'approccio migliore per aggiungere tali stili è probabilmente nel tuo modello.

Il codice seguente aggiungerà un foglio di stile quando l'id della voce di menu è 101.

<?php if (JFactory::getApplication()->getMenu()->getActive()->id=="101") {

        JHtml::_('stylesheet', 'https://cdn.sstatic.net/Sites/stackoverflow/all.css', array());
    } ?>

e quanto segue farà lo stesso quando rileva un articolo di ID 1 (anche se se si utilizzano altri componenti, potrebbe essere necessaria una convalida aggiuntiva per assicurarsi che l'id appartenga a com_content e non a uno degli altri componenti)

<?php if (JFactory::getApplication()->input->get('id')=="1") {

    JHtml::_('stylesheet', 'https://cdn.sstatic.net/Sites/stackoverflow/all.css', array());
} ?>
0
Richard B