[SOLVED] TinyMCE WYSIWYG Editor - αλλαγή γραμμών και tmpl Philoxenia

[psiloscc]

Καλημέρα,
Τώρα τελευταία έβαλα το template Philoxenia σε site με elxis 2009.2 και δεν μου αφήνει κενό όταν αλλάζω γραμμές,

δείτε φωτό:
στην φωτο 01 είναι η προεπισκόπηση με το template Philoxenia και δεν φαίνονται να έχουν καθόλου κενό οι γραμμές

στην φωτο 02 είναι η προεπισκόπηση με το template Open Mind αλλά εδώ μπορεί πάλι να μην αφήνει τόσο κενό όσο του βάζω αλλά τουλάχιστον φαίνεται σαν να έχει μια γραμμή κενή.

μετά από αναζήτηση στο φόρουμ είδα ότι είναι γνωστό το πρόβλημα γιατί δεν αλλάζει από τον κειμενογράφο το P και BR στο "Αλλαγές Γραμμών:" και χρειάζεται να πατάω SHIFT+Enter.

αλλά επειδή έχω πολλά άρθρα που δεν είχα αφήσει κενό με SHIFT+Enter, μπορώ να αλλάξω κάτι στα αρχεία του template Philoxenia για να εμφανίζονται οι κενές γραμμές έστω όπως εμφανιζόντουσαν στο Open Mind΄(φωτό 2)?


[attachment deleted by admin]

[webgift]

Να δούμε φωτό άλλα δεν έχει !!! 

[psiloscc]

Να δούμε φωτό άλλα δεν έχει !!! 

  ξέχασα να τις ανεβάσω, τώρα τις ανέβασα.

[CREATIVE Options]

Ας αφήσουμε την προ επισκόπηση, έξω στα άρθρα ποιο είναι το πρόβλημα ;

[psiloscc]

Ας αφήσουμε την προ επισκόπηση, έξω στα άρθρα ποιο είναι το πρόβλημα ;

Την ίδια ακριβώς απόσταση έχουν οι γραμμές και έξω στα άρθρα στο κεντρικό site το πρόβλημα είναι ότι στο template philoxenia δεν υπάρχει καθόλου απόσταση μεταξύ των γραμμών και θέλω να εμφανίζετε η απόσταση όπως εμφανιζόταν στο template Open Mind.

[CREATIVE Options]

line-height είναι η CSS συνάρτηση που χρειάζεσαι στο template σου.

[psiloscc]

Σε ευχαριστώ για την απάντηση, τώρα τα κοιτάζω για να δω τι πρέπει να αλλάξω και θα σας πω.

κάτι άλλο που είδα τώρα (επειδή οι μεγάλει τίτλοι των άρθρων κολλούσαν στα εικονίδια του email, pdf κλπ.) και θα ήθελα εαν μπορεί κάποιος να μου πεί, εάν είναι σωστό που άλλαξα στο αρχείο customize.css το:

Code: [Select]

/* email, print, rtf, pdf buttons */

div.buttonheading {

margin: -26px 5px 7px 0;

}

και να το έκανα έτσι:

Code: [Select]

/* email, print, rtf, pdf buttons */

div.buttonheading {

margin: 10px;

}
γιατί μόνο έτσι κατάφερα να μην κολλάει ό τίτλος στα εικονίδια (δεν ξέρω όμως εάν έτσι θα υπάρχει πρόβλημα αλλού)
 
εάν είναι λάθος έτσι που έκανα τον κώδικα τί πρεπει να πειράξω;

Ευχαριστώ!

[psiloscc]

Έψαξα όλα τα αρχεία του template philoxenia ένα ένα αλλά δεν έβγαλα άκρη. το μόνο κατάφερα ήταν στο αρχείο layout.css αυτό:

Code: [Select]

body, body.contentpane, div, p {

margin: 0;

padding: 0;

font-family: Tahoma, Verdana, sans-serif;

font-size: 12px;

line-height: 15px;

color: #434343;

}---------------------
να κάνω το
margin: 0;

έτσι:
margin: 30px;

και άφηνε το κενό που ήθελα στα άρθρα αλλα δυστυχώς χαλούσε (μεγάλωνε) το footer.

μπορώ να κάνω κάτι σε αυτόν τον κώδικα ή κάτιτι αλλο για να φτιάξει;

[datahell]

Για το div.buttonheading:

Αν προσέξεις το "κουτί" με τα κουμπιά δίπλα στον τίτλο του άρθρου είναι στην πραγματικότητα κάτω από τον τίτλο σε νέα γραμμή. Το πάνω αρνητικό margin -26px "σηκώνει" αυτό το κουτί ψηλότερα φέρνοντάς το στο ίδιο ύψος με τον τίτλο. Έτσι είναι σαν να βρίσκονται στην ίδια γραμμή ενώ δεν είναι. Αν θες να το αναιρέσεις αυτό βάλε margin 0 ή μεγαλύτερο του μηδενός στην κορυφή
πχ:
div.buttonheading { margin: 5px 5px 7px 0; }

Βάζοντας ένα γενικό div, p {margin: 30px; } είναι χαζομάρα αφού θα σου καταστρέψει τα πάντα στο layout.

Γιατί νομίζεις ότι δεν υπάρχουν "αποστάσεις γραμμών" στο philoxenia; Μία χαρά υπάρχουν.

Σημείωση: αν κάτι δεν υπάρχει στο css ενός template είναι γιατί δεν το χρειάζεται έτσι όπως το σχεδίασε ο αρχικός κατασκευαστής του. Αν θέλετε να το αλλάξετε προσθέστε το εσείς. Μπορείς να προσθέσεις ότι θες στο css.

[psiloscc]

καταρχήν σε ευχαριστώ πάρα πολύ για την βοήθεια, οκ με το div.buttonheading: έκανα αυτά που μου είπες και είναι οκ.

με τις αποστάσεις... κατανοώ ότι έχετε βάλει τα απαραίτητα που χρειάζονται στο template, αλλά τόσο καιρό δεν είχα προσέξει (γαιτί στο template openmind μου άφηνε κανονικά κενό) στον κειμενογράφο τα P και BR και τα έβαζα όλα να γίνονται οι αλλαγές γραμμών με P.

και τώρα οι αποστάσεις στα παλιά άρθρα που δεν έχω πατήσει swift+enter όταν άλλαζα γραμμές εμφανίζονται αλλιώς στο openmind και αλλιώς στο philoxenia

σε λίγο θα ανεβάσω 2 φωτό απο ίδιο site και άρθρο να δείτε ακριβώς την διαφορά μεταξύ των 2 template...

edit:

ανέβασα  τις φωτογραφίες, δείτε την τελευταία γραμμή.

[attachment deleted by admin]

[datahell]

Καταρχάς ο editor έχει μία ρύθμιση για το αν θες πατώντας enter να σου εισάγει BR ή P. Εξ ορισμού είναι P. Επειδή συνήθως το P έχει πάνω-κάτω margin η τελική απόσταση που αφήνει συνήθως είναι μεγαλύτερη από αυτή του BR που καταλαμβάνει συνήθως το ύψος μία γραμμής. Αυτό είναι ανεξάρτητο από το template σας και είναι θέμα ρύθμισης του editor.

Το ύψος που σε ενδιαφέρει δεν έχει να κάνει με αυτά που λες. Είναι η κατακόρυφη απόσταση από το τέλος του άρθρου στα link πλοήγησης. Καμία σχέση με το άρθρο, πρέπει να κοιτάξεις άλλες κλάσεις του css με πιο πιθανή την contentpaneopen_text (το κάτω margin/padding του άρθρου). Στο philoxenia αυτή η απόσταση είναι μηδέν.

div.contentpaneopen_text { text-align:justify; padding:0 4px; }

Τελος αν κάνω κάτι σαν αυτό που έγραψες πριν: p {margin: 30px; } αυτό σημαίνει πως σε κάθε κανή γραμμή στον editor (<p></p>) θα αφήνεις ένα πολύ μεγάλο κενό 60 px + ύψος της γραμμής 16px συνήθως (εδώ εξαρτάται από τον browser που χρησιμοποιείτε αν θα της δώσει ύψος εφόσον είναι κενή).

Έφτιαξα και μία εικονίτσα για να βοηθήσω να καταλάβετε τα ύψη των γραμμών καλύτερα.

[attachment deleted by admin]

[psiloscc]

Είδα την ρύθμιση στον editor αλλά ενώ το ρυθμίζω να εισάγει BR μου τα βγάζει με Ρ, κάπου εδώ στο φόρουμ είδα ένα ποστ για αυτό το πρόβλημα και έγραφε κάποιος να πατάμε shift+enter.

 για το "div.contentpaneopen_text" που μου είπες το κοίταξα αλά δεν έβγαλα άκρη, αύριο πάλι θα τα κοιτάξω ένα ένα τα αρχεία και τους κώδικες μήπως το πετύχω.

Σε ευχαριστώ!

[psiloscc]

Τελικά δεν πρέπει να είναι μόνο  η απόσταση από το τέλος του άρθρου, γιατί δεν μου αφήνει κενό ούτε στην μέση των άρθρων, δείτε φωτό.

Δεν έβγαλα άκρη με το philoxenia, διάβασα πάλι τον οδηγό του elxis για template και κάτι σημειώσεις που είχα και τώρα θα ξανά συγκρίνω από την αρχή το philoxenia με το openmind ή το okto, για να δώ τι διαφορές έχουν μήπως βγάλω άκρη.

[attachment deleted by admin]

[datahell]

Αυτό που δείχνεις τώρα είναι άλλο θέμα. Γιατί πηδάς από θέμα σε θέμα; Αυτό που δείχνεις τώρα είναι απόσταση μεταξύ αντικειμένων λίστας (LI). Δες το margin/padding τους. Πρόκειται για 2 διαφορετικά template και είναι φυσικό να το δείχνουν διαφορετικά αφού έχουν διαφορετικό css. Χρησιμοποίησε το template που θες και άλλαξε τα σημεία που θες.

παράδειγμα 1: μηδενική απόσταση μεταξύ αντικειμένων λίστας:
li { margin: 0; }

παράδειγμα 2: μεγαλύτερη απόσταση μεταξύ αντικειμένων λίστας:
li { margin: 10px 0; }


Δωρεάν σεμινάριο: CSS Basics 2
https://www.elxis.org/el/webinars/

[psiloscc]

Εγώ νόμιζα ότι ήταν το ίδιο θέμα γιατί εγώ βλέπω σαν γενικό πρόβλημα οτι δεν υπάρχουν κενά στις γραμμές, νόμιζα δλδ ότι θα μου λέγατε να άλλαζα ένα κομμάτι μόνο στον κώδικα και θα έφτιαχναν όλα, αλλά τώρα καταλαβαίνω ότι παίζουν πολλά πράγματα σημασία.

Το σεμινάριο CSS Basics 2 το είχα παρακολουθήσει, το απόγευμα διάβαζα τις σημειώσεις που είχα κρατήσει, (βλέπω και τα site για Online βοήθεια που μας είχες δώσει) αλλά δεν τα πολυκαταλαβαίνω.

Θα το κοιτάξω πάλι αύριο και αν δεν βγάλω άκρη ή θα ξανά βάλω το template openmind που είχα ή θα πώ σε κάποιον να μου φτιάξει το συγκεκριμένο κομμάτι.