[RISOLTO] Problemi ridimensionamento sito su iMac e su altri PC

[kkk4]

Salva ragazzi per la prima volta mi sono cimentato nel creare un piccolo ecommerce tutto fatto da me..
quindi premetto che sono molto principiante in tal caso..

inizio subito a darvi qualche informazione:
Io ho un iMac 21,5"
uso la risoluzione 1920x1080
uso Safari e Chrome
Uso il template JA_Purity preinstallato su joomla, quindi a 3 colonne

aprendo la home page, ho messo un banner alla colonna centrale usando il modulo "immagine casuale"
subito sotto ho messo il modulo di virtuemart product scroller settando la dimensione in modo tale che inizia lo scroll da limite esterno di destra e va verso sinistra
fin qui, tutto ok...visualizza tutto bene, ed è perfetto

il problema è sorto quando ho aperto il portatile con windows xp ed uno schermo classico
aprendo il sito, le 3 colonne bene o male si vedono bene sui margini dello schermo, il problema è il banner inserito da me, e il modulo dello scroll, che partono da molto a destra, e praticamente si sovrappongono alla colonna di destra

ho provato con il portatile con windows vista e lo schermo in 16:9...e praticamente il risultato è bene o male lo stesso, un leggero miglioramento nel senso che il banner risulta un po piu piccolo ispetto all'altro pc, ma comunque è troppo grande e si sovrappone andando oltre i margini di destra..

stessa cosa aprendo il sito dall'iphone..

quindi in pratica non ridimensiona il sito automaticamente in base al pc...ma cambia da pc a pc, in base alla risoluzione e al tipo di schermo che uno ha..piu è grande lo schermo, e piu si avvicina al risultato ottimale che ho ora sull'imac

volevo sapere, mi sapete indicare perfettamente cosa modificare e dove, in modo tale da far ridimensionare tutto alla perfezione in base al pc da dove si accede?
perche senò è impossibile avere un sito che in base al pc, si sballa o meno..

ho visto che il template, può essere modificato da Parametri, e ho provato a modificare la voce "ampliezza template", dove ora è impostata in "specificata in percentuale (fluida) e a 97..
ho provato a mettere specificata in pixel a 980..
però in pratica migliora un pochino sugli altri pc, ma peggiora sull'imac perche il templete diminuisce di misura in base allo schermo, ma i banner vanno a finire fuori template..

quindi non so dove modificare
qualcuno mi potrebbe dare una mano?

(poi ho un problema in "gestione pagina principale" che ne parlerò in un'altro topic una volta risolto questo problema)
grazie 1000 a tutti

[conti1]

ciao
benvenuto nel forum
sensa scrivere la cronaca del giorno  bastava dire il problema e postare il link del sito.
posta il link del sito se il template e free, se il template e commerciale  devi chiedere dove lo hai preso grazie

[kkk4]

Scusatemi 

comunque il sito è questo:
www.kkshop.it

il template è free, è quello che è impostato automaticamente con l'installazione di joomla

[conti1]

allora:
partiamo dal fatto che tu non puoi creare un sito con " uso la risoluzione 1920x1080"
quando gli utenti che vedranno il tuo sito non avranno la tua risoluzione.
detto questo  oh dato la risposta,
un utente normale  si aggira  con risoluzione tra 120-1440- 1600  come vedi  anche chi usa una risoluzione 1600 il tuo sito  sballa.
i siti  si costruiscono  con una risoluzione  che si adegui su tutti.

allora prima di tutto  quel template e fluido , e si adatta a qualunque risoluzione.
spalla  xche avrai toccato  qualche larghezza dei moduli ,.

[kkk4]

allora:
partiamo dal fatto che tu non puoi creare un sito con " uso la risoluzione 1920x1080"
quando gli utenti che vedranno il tuo sito non avranno la tua risoluzione.
detto questo  oh dato la risposta,
un utente normale  si aggira  con risoluzione tra 120-1440- 1600  come vedi  anche chi usa una risoluzione 1600 il tuo sito  sballa.
i siti  si costruiscono  con una risoluzione  che si adegui su tutti.

allora prima di tutto  quel template e fluido , e si adatta a qualunque risoluzione.
spalla  xche avrai toccato  qualche larghezza dei noduli ,.

quindi in pratica dovrei impostare sul mio iMac una risoluzione di quelle che hai detto te..e poi lavorare in quel modo?
per il fatto dei "noduli" in che senso?
mi dici che file devo aprire e cosa devo copiarti per farti capire se c'è un'errore ed eventualmente dove devo modificare qualcosa?
la cosa strana è che se rimpicciolisco la finestra del browser, automaticamente si rimpicciolisce anche tutto il sito e tutte le varie sezioni, quindi si adatta alla perfezione in base alla grandezza della finestra..
l'unica cosa che non si adatta, è il banner che ho inserito e il modulo sotto
devo semplicemente ridurre la loro grandezza, impostando una risoluzione standard sul mio schermo, e di conseguenza regolarmi con quella? oppure c'è un modo per far ridimensionare anche quello in automatico?
intanto grazie 1000 per avermi dato una mano

[adottauncane]

Ciao kkk4,
come dice conti1, ciao conti1  , i video partono, per la maggior parte, da una risoluzione di circa 1200 px. Se tieni conto di questo puoi anche lavorare con un video enorme, non ha importanza. La maggior parte dei siti non fluidi è larga 980/1080 px. Se scegli un sito fluido come hai fatto, il banner nella parte centrale fallo 980px meno la larghezza dei due moduli (normalmente, sempre in un sito fisso, di circa 200px) meno i vari margin e padding. In parole povere, il banner fallo circa 500px e andrà bene per la maggior parte dei video, senza passare sotto alla colonna destra. Inizialmente, intanto che fai l'occhio a queste cose, magari usa il template Ja Purity in modalità fissa di 980px di larghezza.

[kkk4]

grazie della risposta
ho impostato una grandezza fissa di 1080 del template
e ho ridimensionato il banner a 500

http://www.kkshop.it/

come lo vedete ora?
sembra andare meglio

1) l'unica cosa che non mi piace però è la barra di sopra, dove c'è il nome del sito e dove c'è il menu principale..
rimane comunque grande pur posizionando i menù e il nome a larghezza template..
e cosi non è molto bello vedere quelle barre laterali vuote
non si potrebbero cacciare?
tipo cosi: http://www.euronics.it/
dove tutto il sito è posizionato al centro e non va oltre i margini del template


2) Ma per impostare un'immagine di sfondo a questo template? come posso fare? tutto bianco cosi è bruttino

[kkk4]

uppo ragazzi

[adottauncane]

Per la prima domanda non ho capito bene ciò che vuoi...
Per la seconda puoi sostituire a quella che trovi qui la tua immagine:

Codice: [Seleziona]

#ja-containerwrap2 {
    -moz-background-clip: border;
    -moz-background-origin: padding;
    -moz-background-size: auto auto;
    background-attachment: scroll;
    background-color: transparent;
    background-image: url("images/cw-bg2.gif"); <----- sostituiscila con la tua
    background-position: 50% 0; <---- da qui puoi posizionarla
    background-repeat: no-repeat; <---- qui dire se riperla o no
}style.css (riga 180)

[kkk4]

Per la prima domanda non ho capito bene ciò che vuoi...
Per la seconda puoi sostituire a quella che trovi qui la tua immagine:

Codice: [Seleziona]

#ja-containerwrap2 {
    -moz-background-clip: border;
    -moz-background-origin: padding;
    -moz-background-size: auto auto;
    background-attachment: scroll;
    background-color: transparent;
    background-image: url("images/cw-bg2.gif"); <----- sostituiscila con la tua
    background-position: 50% 0; <---- da qui puoi posizionarla
    background-repeat: no-repeat; <---- qui dire se riperla o no
}style.css (riga 180)

da me ovviamente è diverso -.-
dal menu del template, andando in css...non esiste il "Style.css"
esistono:
    ja-sosdmenu.css    Scrivibile
    menu.css    Scrivibile
    template.css    Non scrivibile
    template_rtl.css

dove lo trovo quel coso?
in template_rtl.css c'è una stringa con il nome "ja-containerwrap2"
ma non ci sono tutte quelle voci e non riesco a risalire al file originario dell'immagine di sfondo!


ragazzi gentilmente se date un'aiuto, cercate di testarlo prima su un vostro sito, anche perche sto parlando di un template che è installato automaticamente da joomla quindi lo dovreste avere tutti!


per quando rigurda la prima domanda:
se entri nel mio sito, vedrai che di fianco al nome del sito e di fianco alle varie voci del menù principale (in pratica a sinistra della scritta home)..quella barra marroncina, continua fino alle estremità, anche dall'altro lato
mentre sul sito euronics per esempil, tutto il template è in un'unica finestra al centro della pagina, compresi i menu e tutto..e tutto intorno c'è lo sfondo!
capite?

qualcuno mi risolve i due problemi gentilmente?

[adottauncane]

 
Tu un cerca sul tuo PC non ce l'hai? Dove pensi possa essere un file css del template che stai usando?

da me ovviamente è diverso -.-
dal menu del template, andando in css...non esiste il "Style.css"

Ovviamente? E perché?

ragazzi gentilmente se date un'aiuto, cercate di testarlo prima su un vostro sito, anche perche sto parlando di un template che è installato automaticamente da joomla quindi lo dovreste avere tutti!

Serve nient'altro? No, no chiedi pure, soprattutto in questo modo... Per favore, grazie sono paroline magiche sai?

La risposta che ti ho dato è corretta. Uno sforzino da parte tua naturalmente è necessario...
 

Buon lavoro.

[conti1]

convito di quello che dici?
Citazione da: kkk4 - 22 Dic 2010, 22:51:01

    ragazzi gentilmente se date un'aiuto, cercate di testarlo prima su un vostro sito, anche perche sto parlando di un template che è installato automaticamente da joomla quindi lo dovreste avere tutti!

certo che questa e bella, aspetta domani compro un monitor da 22 pollici  , anzi facciamo tutto completo  un bel mac cosi ho la tua visione.
se sponsorizzi 50euro  x consiglio  ti testo tutto il template con le tue modifiche che dici?
cosi divido con adottauncane .
ascoltami bene qui nulla e dovuto ,se diamo consigli di come dovete fare non dovete pretendere che vi facciamo noi il lavoro, poi con un poco d'impegno  provateci a mettere in pratica quello che diciamo, sensa dire "sopratutto dovete testare" .
 sensa neppure avere la cortesia di cliccare  2  tasti  e ringraziare.
il template che usi  e testato  e funziona tu non modificare nulla, il template  funiona.

[kkk4]

ragazzi non vorrei che avete preso in malo modo le mie parole..
non erano rivolte a nessuno in particolare, e non era una critica rivolta a qualcuno
semplicemente mi sono trovato spesso in alcune pagine di informazioni, dove alla fine o era completamente diverso da quello che vedevo o c'erano dei consigli incompleti...tutto qui

quindi siccome se uno dice: vai ne template, e sul file Style.css trovi questa stringa...
io vado nella pagina del templeta, vado nell'icona dove mi apre i css, e trovo quei file elecati sopra e non quello..
quindi mi ritrovo punto e accapo
semplicemente non vorrei che magari in tutti gli altri template quella procedura è esatta, mentre magari su determinati altri template, c'è qualcosa di diverso
tutto qua

è normale e palese che qua i consigli sono tutti gratuiti e quindi nessuno è dovuto a darli
quindi come ho gia fatto negli altri post, ringrazio vivamente chi da una mano a chi come me, ne capisce ben poco essendo alle prime armi.

[kkk4]

scordavo di dire che il file style.css lo ho trovato..ma ce ne sono parecchi dentro la cartella del template, sparsi in varie posizione..
quindi mi riuscite ad indicare qual'è di preciso?

[adottauncane]

E sì, abbiamo preso le tue parole nell'unico modo in cui si potevano prendere... magari prima di postare rileggi quello che hai scritto e vedrai che le prenderai per quello che sono anche tu.

Pensi davvero che diamo consigli a caso? Come credi che possiamo dirti il file e la riga da correggere se non guardiamo nel tuo sito? Se avessi meno fretta e un po' più di umiltà vedresti che quel file è nel pacchetto del template, basta cercarlo. Non lo vedi subito? Hai l'icona in alto con la lentina che non solo ti trova il file ma pure la riga dove c'è scritto quello che devi correggere. Non lo trovi ancora? Chiedi: scusate, non trovo il file che mi avete indicato, dov'è? E noi te lo indichiamo.
Ma se parti dal presupposto che spariamo cavolate, scusa, ma un pochino la prendiamo a male.

E poi, essendo tu come dici un principiante, non dire tu cose a caso. Cosa vuol dire "testate" il template? Le correzioni le indichiamo sul tuo di template, se no a che ti servono? Sai come si fa? No? E allora perché pretendi di insegnare agli altri come fare per aiutarti?

La procedura che ti ho indicata non è adatta a tutti i template, perché ogni template è fatto a modo suo. È adatta al template che usi, anzi proprio "il" template che stai usando in quel momento che potrebbe essere diverso da un altro Ja Purity non modificato o modificato in maniera diversa.

Poi potrei pure sbagliare, succede sai? E allora invece di inalberarti, di nuovo chiedi, come mai non lo trovo? Se ho sbagliato chiedo scusa, per me non è un problema. E ti assicuro che conti1 fa lo stesso e se io sbaglio lui mi corregge, funziona così quando ci si aiuta.

Adesso cerca il file che ti ho indicato sul tuo Mac, correggi le cose che ti ho detto, caricalo via ftp e vedrai che funziona.

Per mettere a posto la testata ci vuole un po' più di tempo. Intanto guarda tutti i file che compongono Ja Purity, in modo che se ti diamo indicazioni saprai già dove mettere le mani.

Quando avrai messo a posto lo sfondo, torna a postare e aggiustiamo anche la testata.

[kkk4]

bhe evidentemente mi sono espresso male e me ne scuso
ma non pretendo di insegnare niente a nessuno perche sono veramente ignorante in mantera quindi non sono capace di dare giudizi io..

ritornando al negozio, ho fatto la ricerca, ma come ho scritto prima, ho trovato vari file in quel modo..
ora vi spiego tutto
allora:

1) Joomla_1/templates/ja_purity/styles/elements/black/style.css
ma non esistono linee che iniziano con "#ja-containerwrap2" (come indicato da voi sopra)



2)Joomla_1/templates/ja_purity/styles/background/lighter/style.css
per quando riguarda la riga, ce ne sono due e sono cosi indicate:

#ja-containerwrap2 {
   background: url(images/cw-bg2.gif) no-repeat 50% 0;
oppure

#ja-containerwrap-fr #ja-containerwrap2 {
   background: url(images/cw-bg2.gif) no-repeat 50% 0;

Solo queste due...



3)Joomla_1/templates/ja_purity/styles/header/blue/style.css
ma quelle righe non esistono



4)Joomla_1/templates/ja_purity/styles/header/green/style.css
ma quelle righe non esistono



5)Joomla_1/templates/ja_purity/styles/background/purewhite/style.css
due righe

#ja-containerwrap2 {
   background: url(images/cwf-bg.gif) repeat-x top left;

#ja-containerwrap-fr #ja-containerwrap2 {
   background: url(images/cwf-bg.gif) repeat-x top left;

e basta


6)Joomla_1/templates/ja_purity/styles/elements/red/style.css
ma non esistono quelle righe



7)Joomla_1/templates/ja_purity/styles/elements/green/style.css
ma non esistono quelle righe



8)Joomla_1/templates/ja_purity/styles/elements/blue/style.css
ma non esistono quelle righe



stop...non trovo altri file con estensione e nome "Style.css"
ci sono solo questi...e le righe che riportano quella prima parola che avete elencato voi, sono quelle di sopra...ma non mi sembrano uguali a quelle che avete quotato voi, che sono molto piu lunghe, con molte altre spiegazioni..

quindi gentilmente, qualcuno mi può dare una mano 

[adottauncane]

Il file corretto è questo:
style/background/lighter/style.css

cioè quello che hai individuato qui:

Codice: [Seleziona]

2)Joomla_1/templates/ja_purity/styles/background/lighter/style.css
per quando riguarda la riga, ce ne sono due e sono cosi indicate:

#ja-containerwrap2 {
   background: url(images/cw-bg2.gif) no-repeat 50% 0;

Le regole css che noi vediamo dal nostro computer sono interpretate da Firebug per Firefox (che ti consiglio vivamente di scaricare e utilizzare, una mano santa per i css)
http://www.joomla.it/articoli-della-community/797-tre-moschettieri-al-servizio-di-joomla.html

quindi è possibile che non ci sia una corrispondenza visuale identica a quello che poi trovi in effetti scritto sul file. Ma solo "visuale" e cioè la regola background la puoi scrivere come l'hai trovata o scomporla come l'ho scritta io (copiandola con Firebug direttamente dal tuo sito)

in parole povere, se guardi attentamente le due regole sono uguali:

Codice: [Seleziona]

background: url(images/cw-bg2.gif) no-repeat 50% 0;

Codice: [Seleziona]

background-image: url("images/cw-bg2.gif"); <----- sostituiscila con la tua
    background-position: 50% 0; <---- da qui puoi posizionarla
    background-repeat: no-repeat; <---- qui dire se ripeterla o no
solo che la seconda è più facile da capire perché ogni css è scomposto e intuitivamente sai di cosa parla.

Allora non ti rimane che prendere la regola scomposta, sostituirla a quella su una riga, scrivere il nome dell'immagine che userai come sfondo al posto di quella che c'è, dopo aver messo la tua nella stessa cartella in cui trovi l'originale cw-bg2.gif

Poi decidi se vuoi che si ripeta o no repeat o no-repeat

E da

Codice: [Seleziona]

background-position: 50% 0; <---- da qui puoi posizionarla la posizioni. Potrebbe andare bene, se l'immagine è unica, anche background-position:center top;

Prova e se hai dei problemi lascia il sito on line con l'immagine nuova caricata, in modo che si possa aiutarti... 

[kkk4]

allora ho aperto tramite "filezilla" che è il mio programma per mac per accedere al server e tutte le varie cose
sono andato al file sopra citato
e ho modificato la riga con
"#ja-containerwrap2 {
   background: url(images/1.jpg) no-repeat 50% 0;"

poi nella stessa cartella oltre a questo file "style.css" c'è la cartella images...che presumo sia quella alla quale si riferisce quella stringa
quindi entrandoci (Joomla_1/templates/ja_purity/styles/background/lighter/images/) ho inserito qua dentro il file "1.jpg" ovvero una mia immagine a caso..
caricato..

il sito non è cambiato di una virgola!
sempre sfondo bianco come di default..
è normale? o devo fare qualche altra cosa??


se mi dite che è normale..allora provo a sostituire tutta la stringa con quella "lunga" che avete scritto voi, e riprovo

[adottauncane]

Dai che ci sei quasi... 
Allora, hai fatto tutto bene, solo che l'immagine è dietro al template vero e proprio:

Codice: [Seleziona]

#ja-containerwrap2 {
    -moz-background-clip: border;
    -moz-background-origin: padding;
    -moz-background-size: auto auto;
    background-attachment: scroll;
    background-color: transparent;
    background-image: url("images/1.jpg");
    background-position: right top; <---- metti così
    background-repeat: no-repeat;
}style.css (riga 180)
normalmente però, se l'immagine è adatta dovresti mettere center top... e magari anche background-attachment: fixed; ma una cosa per volta...
Adesso vedrai spuntare la tua immagine a destra del template. Il problema è che l'immagine non è adatta ad uno sfondo perché devi tener conto che per 1080px, cioè quelli del tuo template vero e proprio, nel centro del video non si vedrà... l'immagine che usi per lo sfondo deve essere costruita in modo che, anche se coperta dalla parte centrale, sia ancora visibile... Per esempio, se vuoi visualizzare un oggetto come quello potresti dividere l'immagine e metter al centro 1080px vuoti. Oppure costruirne una con uno sfondo scuro e diversi oggetti posizionati ai margini.
Qui ho messo una doppia immagine solo ai bordi: http://www.pilatesconlaura.it qui diverse immagini http://www.annavivarelli.it
Oppure potresti fare una texture tipo questa: http://www.apachi.it/

Adesso ho messo i miei sitarelli per farti un esempio, fai un giro sul web dove magari cerchi siti affini al tuo e vedi come hanno realizzato gli sfondi. Con Firebug puoi ispezionare il loro codice e vedere le dimensioni e il codice di backgroun che hanno usato... così puoi farti un'idea e costruire un bel background adatto a far risaltare tutto il template.

Tieni conto che l'immagine deve essere il più leggera possibile...

[kkk4]

perfetto..ci siamo quasi
allora ho messo come hai scritto tu, e mi è apparsa a destra..
mentre mettendo center top, mi appare al centro, dove c'è il tutto..e viene coperta dal bianco, quindi non appare..
il problema è che anche facendo un'immagine come dici tu, ai bordi non sbuca l'immagine perche facendo cosi è come se i margini dell'immagine sono i bordi delle colonne esterne...quindi sta all'interno lei..e non va oltre i bordi..e quindi intorno rimane sempre bianco..

in pratica ora, o creo un'immagine bianca al centro e con i bordi esterni con delle immagini...oppure un template unico come quello nero tuo..
fin qua ci siamo
devo però sapere dove devo modificare per far si che l'immagine prenda tutta la pagina (a prescindere da cosa viene coperto poi) e non solo all'esterno o all'interno del "template"

capito che voglio dire? 
lo lascio cosi ora, cosi puoi vederlo tu stesso