Testo con immagine in background

[mao72]

avrei la necessità di inserire nella sidebar di wordpress l'immagine in allegato e poichè il sito è multilingua dovrei fare in modo che l'immagine abbia il testo traducibile con in background l'immagine della carta strappata con il relativo link alla pagina
qualcuno potrebbe dirmi il codice da inserire?
Grazie

[Prill]

qualcuno potrebbe dirmi il codice da inserire?

non è possibile darti un codice, dovrai ricercare il blocco di codice della tua sidebar e aggiungere al suo interno il link con il tuo testo e applicargli quello sfondo (lo sfondo potrebbe essere aggiunto su un div che contenga il link, oppure direttamente sul link che abbia un display:block e dimensioni equivalenti a quelle dell'immagine)

[mao72]

mi spiego meglio, wordpress ha la possibilità di usare dei widget, uno di questi si chiama Testo dove all'interno ci si può mettere di tutto anche codice html

[Prill]

conosco wp, e le personalizzazioni possibili dal pannello di controllo o meglio e direttamente dai sorgenti php, ma indipendentemente dallo strumento usato non è chiaro che codice vuoi che ti si suggerisca: come detto puoi inserire un link con display:block e dimensioni equivalenti a quelle dell'immagine di sfondo e aggiungere nel css un id o una classe per quel link cui assegnerai il suo sfondo. Dove è la difficoltà per te? nel codice per creare il link o nella modifica su wp?

[mao72]

molto semplicemente la difficoltà è che non sono esperto di html ccs ecc ecc

[Prill]

se vuoi usare il widget text, puoi inserire al suo interno qualcosa del tipo

<div id="myDiv">ABBIGLIAMENTO</div>

e poi potrai modificare il css (da editor in Appearance) aggiungendo

#myDiv {
	width:271px;
	height:51px;
	text-decoration:none;
	background: url(percorso/abbigliamento-sidebar.jpg) no-repeat;
	font-size:20px;
	font-weight:bold;
	line-height:51px;
}
a#abb {
	display:block;
	height:51px;
	text-decoration:none;
	color:#fff;
	padding-left:60px; /* per spostare il testo del link verso destra */
}

le misure sono puramente esemplificative (basate sulla tua immagine, ma bisognerà vedere la larghezza della tua sidebar). Tutto il resto puoi personalizzarlo, i nomi degli id possono essere variati come meglio credi - prova prima il codice in una pagina html vuota, finché avrai la visualizzazione voluta, come font, sua grandezza eccetera

Ma sempre dall'editor in appearance puoi anche inserire direttamente il div nel file sidebar.php
(salva una copia del file prima di apportare qualsiasi modifica)

[mao72]

innanzitutto grazie per l'aiuto
non, posso inserire tutto nel widget?
questo è il sito in questione
http://www.cartotecnicapugliese.it/
ne dovrò inserire più di uno di immagini

[Prill]

se vuoi inserire tutto nel widget, puoi rimuovere gli id dal div e dal link e inserire le dichiarazioni di stile in linea, anche se non è la via più pulita perché appesantisci il codice:

<div style="width... eccetera">ABBIGLIAMENTO</div>

[mao72]

vediamo se ho capito

i due codici che tu hai separato, li posso mettere insieme nel widget Testo e ripeterlo per N volte quante me ne servono, giusto?


la via pulita quale sarebbe, sempre per le N volte?

Grazie

[Prill]

la via più pulita è evitare dichiarazioni di stile in linea e inserirle invece nel css, tanto più se devi usare elementi con la stessa formattazione (in questo caso sarà necessario usare una classe e non un id, oppure definire nel css un selettore discendente (ad esempio:
#myDiv a {proprietà}
che significa che tutti i link all'interno del div in questione avranno le proprietà che imposterai)