Τεντωμα εικονας logo ?

Started by lionKingMan, October 22, 2010, 05:53:41 PM

Previous topic - Next topic

lionKingMan

Πως θα μπορεσω να τεντωσω την εικονα του logo μου ετσι ωστε να εμφανιζετε καλα και σε αναλυση <1280px ?
Για περισσοτερες λεπτομερειες να πω οτι πανω-πανω υπαρχει μια εικονα του logo και μια αλλη απο πισω που ειναι το background του οποιου η εικονα επαναλαμβανετε αλλα λογο του οτι εχω δημιουργησει μεγαλο logo σε μεγεθος δεν φαινετε.Οταν ομως αλλαξεις την αναλυση τοτε χαλαει η εικονα....

villasg

Μια απλη και μαματη λυση ειναι το Mod "Header Rotator"

Απλα αντι για πολλες εχεις στο φακελο header μια εικονα μονο !

lionKingMan

Εγκατασταση απο που θα το κανω?
απο την διαχειριση πακετων η χειροκινητα ?

andy12gr

Καλα ειναι να το κανεις απο τη διαχειρηση ετσι αν δεν το δεχεται για καποιους λογους να στο υποδειξει αλλιως και χειροκινητα γινεται.

lionKingMan

Δεν ειναι συμβατο με την εκδοση του SMF που εχω.Κατι αλλο για να λυσω το προβλημα ?

villasg

Τι εχεις γιατι βλεπω το εξης :
Συμβατό με:     1.1.4, 1.1.6, 1.1.7, 1.1.8, 1.1.9, 1.1.10, 2.0 RC1, 2.0 RC1-1, 2.0 RC1.2

και στο δικο μου 1,11 παιζει μια χαρα

lionKingMan

Ναι , αυτο το ειδα και εγω αλλα οταν πηγα να το εγκαταστησω απο την διαχειριση πακετων μου εμφανιζε στα δυο απο τα τρια πακετα πως δεν ειναι συμβατο.Το αλλο πακετο ελεγε πως δεν μπορουσε να εγκαταστησει ορισμενα αρχεια.Χειροκινητα δεν το τολμησα γιατι το φοβαμαι λιγο ειναι η αληθεια.

nikan

QuoteΠως θα μπορεσω να τεντωσω την εικονα του logo μου ετσι ωστε να εμφανιζετε καλα και σε αναλυση <1280px ?

Αυτό δεν έχει καμία σχέση με το παραπάνω mod το οποίο αλλάζει την εικόνα στο πάνω μέρος της σελίδας με τις εικόνες που έχουμε στον συγκεκριμένο φάκελο.
Για να μεγαλώνει και να μικραίνει η εικόνα ανάλογα με την ανάλυση της οθόνης θα πρέπει να χρησιμοποιηθεί κάποιο script σαν το mod Resize Images To Fit Screen.

lionKingMan

Η εκδοση που εχω ειναι η SMF 2.0 RC3.
Οταν την κανω εγκατασταση μεσω της διαχειρισης πακετων μου εμφανιζει τα παρακατω αρχεια με τις αναλογες επισυμανσεις.

   1.    Εξαγωγή Αρχείο    ./Themes/default/scripts/imagefit.jquery.js    
   2.    Εξαγωγή Αρχείο    ./Themes/default/scripts/imagefit.jquery.library.js    
*    3.    Εκτέλεση τροποποίησης    ./Themes/default/languages/Modifications.english.php    Το τεστ ήταν επιτυχές
      1.    Προσθήκη πριν    ./Themes/default/languages/Modifications.english.php    Το τεστ ήταν επιτυχές
   4.    Εκτέλεση τροποποίησης    ./Themes/default/languages/Modifications.french.php    Παράβλεψη αρχείου
*    5.    Εκτέλεση τροποποίησης    ./Sources/Load.php    Το τεστ ήταν επιτυχές
      1.    Προσθήκη πριν    ./Sources/Load.php    Το τεστ ήταν επιτυχές
*    6.    Εκτέλεση τροποποίησης    ./Sources/ManageSettings.php    Το τεστ ήταν επιτυχές


να το κανω εγκατασταση ?

nikan

Ναι, μπορείς να το εγκαταστήσεις. Ίσως χρειαστεί να απενεργοποιήσεις το Image Toggle του RC3, μπορείς να το κάνεις με αυτό το mod Disable Image Toggle.

lionKingMan

Για να καταληξω καπου σιγουρα.
Δηλαδη ακομα και με αυτα που μου εμφανισε για τα αρχεια να το εγκαταστησω ?
ΑΝ δεν λειτουργησει τοτε θα πρεπει να εγκαταστησω και το δευτερο mod ?
( μην τα μπλεξουμε..... )

nikan

Καταρχήν κανένα mod δεν κάνει ακριβώς αυτό που ζήτησες (μεγέθυνση/σμίκρυνση εικόνας logo)
Το πρώτο mod κάνει εναλλαγή εικόνων στην περιοχή της εικόνας logo.
Το δεύτερο αλλάζει την διάσταση της εικόνας, ανάλογα με την ανάλυση της οθόνης, αλλά θεωρητικά το κάνει στις εικόνες που βρίσκονται στα μηνύματα. Θεωρητικά σημαίνει ότι θα πρέπει να πειραματιστείς δίνοντας στις παραμέτρους τιμές που αντιστοιχούν στην περιοχή logo.

QuoteΔηλαδη ακομα και με αυτα που μου εμφανισε για τα αρχεια να το εγκαταστησω ?
Δεν σου εμφάνισε μήνυμα λάθους οπότε μπορείς να συνεχίσεις.

lionKingMan

Quote from: nikan on October 30, 2010, 03:04:38 AM
Καταρχήν κανένα mod δεν κάνει ακριβώς αυτό που ζήτησες (μεγέθυνση/σμίκρυνση εικόνας logo)
Το πρώτο mod κάνει εναλλαγή εικόνων στην περιοχή της εικόνας logo.
Το δεύτερο αλλάζει την διάσταση της εικόνας, ανάλογα με την ανάλυση της οθόνης, αλλά θεωρητικά το κάνει στις εικόνες που βρίσκονται στα μηνύματα. Θεωρητικά σημαίνει ότι θα πρέπει να πειραματιστείς δίνοντας στις παραμέτρους τιμές που αντιστοιχούν στην περιοχή logo.

QuoteΔηλαδη ακομα και με αυτα που μου εμφανισε για τα αρχεια να το εγκαταστησω ?
Δεν σου εμφάνισε μήνυμα λάθους οπότε μπορείς να συνεχίσεις.


Ωραια το εχω εγκαταστησει.

Στα παρακατω textboxes τι πρεπει να βαλω ?


[ImageFit] Enable fiting images to screen size in messages.     
[ImageFit] Optional: enter reference container id/class of your theme (empty = by default: #forumposts)   ->>>>>  ???????
[ImageFit] Optional: enter the image id or class to be fitted (empty = by default: .bbc_img)    ->>>>>  ???????



nikan

Εδώ είναι τα δύσκολα γιατί πρέπει να δεις τι id ή class έχει στον κώδικα της περιοχής logo και το ίδιο για την εικόνα.

lionKingMan

μπορεις να μου δωσεις ενα παραδειγμα ?
Απο οτι καταλαβα θελει στο container id/class το #logo a {.....}
αλλα στο image id or class ποιο να βαλω ?

nikan

Δοκίμασε στο container τα #header, #logo και στο image το #smflogo

lionKingMan

Οχι δεν λειτουργει....
Δεν υπαρχει καποιος αλλος τροπος για να το βρω ?

nikan

#17
Τροποποίησα το mod ResizeImagesToFitScreen ώστε να αλλάζει τις διαστάσεις της εικόνας που έχουμε στην περιοχή του SMF Logo ανάλογα με την ανάλυση της οθόνης του χρήστη.


Προσθήκη: Διαγράφηκε το συνημμένο. Mods, με ή χωρίς τροποποίηση μπορεί να διανεμηθούν μόνο από τον δημιουργό ή με άδεια του. Ισχύει και για το site του SMF και για άλλα sites.

lionKingMan

#18
Το εκανα εγκατασταση αλλα δεν υπαρχει καποιο πανελ για να ρυθμισω την εικονα ?
Το ονομα της εικονας logo μου πως πρεπει να ονομαζετε για να το "βλεπει" ? ( logo.png το εχω τωρα )
Δεν φαινετε να λειτουργει......

nikan

Δεν έχει ρυθμίσεις γιατί είναι αποκλειστικά για την εικόνα logo (πάνω δεξιά, εικόνα simplemachines)
Το όνομα της εικόνας μπορεί να είναι οτιδήποτε, το mod παίρνει τα id της περιοχής (div) και της εικόνας (img)

lionKingMan

Quote from: nikan on November 07, 2010, 02:01:30 AM
Δεν έχει ρυθμίσεις γιατί είναι αποκλειστικά για την εικόνα logo (πάνω δεξιά, εικόνα simplemachines)
Το όνομα της εικόνας μπορεί να είναι οτιδήποτε, το mod παίρνει τα id της περιοχής (div) και της εικόνας (img)


Σε εμενα υπαρχουν δυο εικονες.
Η "πισω" εικονα body-bg.jpg
και η μπροστα εικονα logo.png.

Εγκατεστησα το mod σου αλλα δεν δουλευει.Το ειδα και σε αλλα pc με αλλες αναλυσεις....
Μπες να το δεις αν θελεις.http://teikozanis.gr

nikan

Επισύναψε το αρχείο index.template.php ή όλο το κομμάτι του κώδικα που είναι αυτές οι εικόνες, όχι μόνο τα <img ...>

lionKingMan

Quote from: nikan on November 08, 2010, 12:41:17 AM
Επισύναψε το αρχείο index.template.php ή όλο το κομμάτι του κώδικα που είναι αυτές οι εικόνες, όχι μόνο τα <img ...>


Δεν καταλαβα.......Να ανεβασω το σρχειο?

nikan

Ναι αυτό εννοώ, ανέβασε το αρχείο index.template.php της εμφάνισης που έχεις ή γράψε τον κώδικα που αφορά τις εικόνες της περιοχής logo.
Αν βάλεις κώδικα πρέπει να χρησιμοποιήσεις το κουμπί δίεση 'Εισαγωγή κώδικα'

nikan

Το mod που σου έδωσα δουλεύει με την default εμφάνιση όπως όλα τα mod.
Γράψε εδώ τον κώδικα <img ...> που έχεις την εικόνα logo μήπως βγάλουμε άκρη.

Έχω μια απορία, μόνος σου έκανες τις αλλαγές στη σελίδα σου;

nikan

#25
Στο αρχείο index.css προσθέτεις το παρακάτω
#top_section {
position: absolute;
top: 0;
left: 0;
display: block;
width: 100%;
height: 100px;
}
#smflogo {
  border: 0;
}


Στο αρχείο index.template.php αλλάζεις αυτό
<div id="logo">
<a href="'.$scripturl.'" title=""></a>
</div>


με αυτό
<div id="top_section">
<a href="'.$scripturl.'" title=""><img id="smflogo" src="http://www.teikozanis.gr/meeting/Themes/mysticjade_20rc3/images/custom/logo.png" alt="" /></a>
</div>

nikan

#26
Μια διόρθωση, το style.css πρέπει να είναι index.css
Και μία ακόμα, η διαδρομή που έβαλα είναι από το τοπικό ενώ πρέπει να είναι από τη σελίδα σου

Διορθώθηκαν

Τα παραπάνω είναι δοκιμασμένα σε τοπικό και δουλεύουν με το mod που έφτιαξα το οποίο αλλάζει τις διαστάσεις MONO της εικόνας smflogo και του έδωσα το όνομα ResizeLogoToFitScreen, κάτι σαν νέο mod με βάση το ResizeImagesToFitScreen.

lionKingMan

Quote from: nikan on November 10, 2010, 10:19:44 AM
Μια διόρθωση, το style.css πρέπει να είναι index.css
Και μία ακόμα, η διαδρομή που έβαλα είναι από το τοπικό ενώ πρέπει να είναι από τη σελίδα σου

Διορθώθηκαν

Τα παραπάνω είναι δοκιμασμένα σε τοπικό και δουλεύουν με το mod που έφτιαξα το οποίο αλλάζει τις διαστάσεις MONO της εικόνας smflogo και του έδωσα το όνομα ResizeLogoToFitScreen, κάτι σαν νέο mod με βάση το ResizeImagesToFitScreen.


Δεν καταλαβα αυτο -> που έβαλα είναι από το τοπικό ενώ πρέπει να είναι από τη σελίδα σου
και επισης αν δημιουργησω ενα αρχειο index.css και βαλω εκει τον κωδικα σου θα ειναι οκ ?




nikan

Το αρχείο με τα χρώματα της εμφάνισης είναι το index.css δεν χρειάζεται να το δημιουργήσεις.
Η διεύθυνση της εικόνας logo.png που είχα βάλει ήταν από το τοπικό server δοκιμής που έκανα και γι'αυτό δεν εμφανιζόταν η εικόνα σου, τώρα είναι ok.

lionKingMan

#29
Quote from: nikan on November 10, 2010, 05:29:12 AM
Στο αρχείο index.css προσθέτεις το παρακάτω
#top_section {
position: absolute;
top: 0;
left: 0;
display: block;
width: 100%;
height: 100px;
}
#smflogo {
  border: 0;
}


Στο αρχείο index.template.php αλλάζεις αυτό
<div id="logo">
<a href="'.$scripturl.'" title=""></a>
</div>


με αυτό
<div id="top_section">
<a href="'.$scripturl.'" title=""><img id="smflogo" src="http://www.teikozanis.gr/meeting/Themes/mysticjade_20rc3/images/custom/logo.png" alt="" /></a>
</div>



Χρησιμοποιησα ακριβως αυτον των κωδικα και λειτουργησε.
Το προβλημα ηταν οτι εμφανιζε ενα μικρο ασπρο πλαισιο και μου ειπες οτι ειναι το background.Ετσι τον εσβησα τον κωδικα γιατι μου φαινοταν λιγο ασχημο.Δεν μπορει να γινει κατι γι'αυτο?

nikan

Ναι, αυτό πρέπει να κάνεις

lionKingMan

Πραγματι λειτουργει!

thanks!!!

Ομως δες οτι εμφανιζει ενα μικρο ασπρο πλαισιο....τι μπορει να φταιει?

http://teikozanis.gr

nikan

Δεν έχει background και μένει λευκό

lionKingMan

Quote from: nikan on November 10, 2010, 02:08:52 PM
Δεν έχει background και μένει λευκό

Να δωσω μια ιδεα ?
Δεν ξερω αν μπορει να γινει αλλα απο την στιγμη που "τεντώνει" την εικονα δεξια αριστερα , γιατι να μην την τεντωνει και πανω κατω ?

ευχαριστω για την βοηθεια!

nikan

Αυτό που κάνει το mod είναι να μικραίνει αναλογικά (width & height) την εικόνα για να χωράει στην οθόνη του χρήστη και όχι να την μεγαλώνει.
Έτσι μπορούμε να βάλουμε μια εικόνα τεράστιων διαστάσεων και να εμφανίζεται ολόκληρη σε όλες τις αναλύσεις της οθόνης.

Νομίζω ότι έβαλες παραπάνω/περιττό κώδικα από αυτόν που σου έδωσα και ίσως εκεί να θέλει διόρθωμα.

lionKingMan

Quote from: lionKingMan on November 10, 2010, 12:09:55 PM

Στο αρχείο index.css προσθέτεις το παρακάτω
#top_section {
position: absolute;
top: 0;
left: 0;
display: block;
width: 100%;
height: 100px;
}
#smflogo {
  border: 0;
}


Στο αρχείο index.template.php αλλάζεις αυτό
<div id="logo">
<a href="'.$scripturl.'" title=""></a>
</div>


με αυτό
<div id="top_section">
<a href="'.$scripturl.'" title=""><img id="smflogo" src="http://www.teikozanis.gr/meeting/Themes/mysticjade_20rc3/images/custom/logo.png" alt="" /></a>
</div>


Χρησιμοποιησα ακριβως αυτον των κωδικα και λειτουργησε.
Το προβλημα ηταν οτι εμφανιζε ενα μικρο ασπρο πλαισιο και μου ειπες οτι ειναι το background.Ετσι τον εσβησα τον κωδικα γιατι μου φαινοταν λιγο ασχημο.Δεν μπορει να γινει κατι γι'αυτο?

nikan

Το πρόβλημα βρίσκεται στο index.css

Αντικατέστησε με αυτό το #header και άλλαξε το background με αυτό που έχεις
#header {
position: relative;
overflow: hidden;
background: #1a1a1a url(../images/custom/header-bg.png) repeat-x;
}


και πρόσθεσε αυτό
#top_section {
   position: absolute;
   top: 0;
   left: 0;
   display: block;
}
#smflogo {
  border: 0;
}

lionKingMan

nikan sorry αλλα δεν καταλαβα τι ακριβως πρεπει να κανω ?

Τι να αλλαξω και που ?

nikan

Θα γράφουμε τα ίδια και τα ίδια. Ανέβασε (πατάς 'Συννημένα και άλλες επιλογές' και 'Επισύναψη αρχείου' -> 'Browse...') τα αρχεία index.css και index.template.php να στα φτιάξω


nikan

Ορίστε φίλε μου, ελπίζω να είσαι εντάξει τωρα  8)
Και όταν θα αρχίσεις το πείραγμα, γιατί θα το αρχίσεις  ;D, κράτησε backup των αρχείων για επαναφορά των πρωτότυπων και όχι αυτών που δούλευαν τελευταία.

lionKingMan

Απλα respect και ευχαριστω !!!
Φοβερο.... :laugh: :laugh: :laugh:

Eyesman

Καλησπέρα παιδιά.

Προσπάθησα να εγκαταστήσω το Header Rotaror αλλά μου βγάζει: "Το πακέτο που προσπαθείτε να εγκαταστήσετε είναι είτε κατεστραμμένο είτε μη συμβατό με την παρούσα έκδοση του SMF."

Το smf μου είναι το τελευταίο version - 1.1.12

Απλά θέλω να βάλω ένα background στο header, εκεί που είναι το logo του smf. Το background θέλω να πάιρνει όλο τον χώρο. Αλλά χωρίς μπάρα απο κάτω.

Υπάρχει κάτι άλλο που μπόρω να κάνω?

Σας ευχαριστώ.

lionKingMan

Βαλε μια μεγαλυτερη εικονα αντι για εκεινη τη μικρη.
Απο εκει και μετα επειδη υπαρχουν διαφορες στην αναλυση απο pc σε pc θα χρειαστεις ενα τμημα κωδικα που νομιζω οτι σε καποιο δικο μου ποστ υπαρχει.(μπορει και σε αυτο) Ψαξε το

Advertisement: