Προσθέτοντας θέματα στο MP6

VN:F [1.9.22_1171]
Rating: 5.0/5 (1 vote cast)
FavoriteLoadingΠροσθήκη στα Αγαπημένα μου
21/09/2013 από
infogeek

Όσοι δεν ξέρετε το MP6, είναι ένα plugin που αλλάζει την εμφάνιση του wordpress backend, ή αλλιώς τις σελίδες διαχείρισης περιεχομένου του! Δίνει μία πολύ καθαρή και ωραία εμφάνιση βοηθώντας πολύ στην κατανόηση του περιβάλλοντος του wp.

Παρόλα αυτά, όλοι έχουμε τις βίδες μας… Και μπορεί να θέλουμε να αλλάξουμε κάτι! Κι επειδή ο σωστός coder / designer δεν κάνει ποτέ hardcode. Εδώ θα σας παρουσιάσω τη σωστή λύση, για να προσθέτουμε θέματα στο MP6 wordpress plugin.

Προετοιμασία

Πρώτα από όλα, πρέπει να ξέρουμε τι χρειαζόμαστε για να ξεκινήσουμε (τη συνταγή!). Θέλουμε δύο αρχεία, το _colors.scss και το _variables.scss που βρίσκονται στο φάκελο του plugin “components\color-schemes\schemes” και την συνάρτηση που προσθέτει θέματα, προς το παρόν είναι η wp_admin_css_color. Αλλά επειδή μπορεί να αλλάξει το όνομα και η σύνταξη απλά ελέγξτε το αρχείο components\color-schemes\colors.php στη συνάρτηση mp6_colors_register_schemes, για να δείτε τι συνάρτηση χρησιμοποιεί για να προσθέσει τα color schemes. Επιπλέον θα χρειαστείτε εγκατεστημένη τη ruby, τα gems της ruby, και τη sass. Αν πάλι δεν θέλετε να εγκαταστήσετε όλα αυτά, θα σας αναφέρω τη διαδικασία στο αντίστοιχο σημείο.

Διαδικασία

Αφού βεβαιωθούμε ότι έχουμε βρει αυτά που χρειαζόμαστε! Αντιγράφουμε σε ένα ξεχωριστό φάκελο με επαρκή αδειοδότηση για αλλαγές ( αν είστε με windows, όπου να ναι, πιο εύκολα επιφάνεια εργασίας, σε linux ή mac, όπου σας βολεύει) τα δύο αρχεία scss που προανέφερα. Και στο _variables.scss αλλάζουμε τα χρώματα που θέλουμε να αλλάξουν, χωρίς να πειράξουμε το _colors.scss και ανοίγοντας μία console στο φάκελο δημιουργούμε ένα κενό αρχείο css, εγώ δουλεύω με vim όποτε vim mycolors.css και αμέσως esc και :w, :q.


    Με linux terminal echo "" > mycolors.css
    Με windows copy con "" > mycolors.css

Και έπειτα χωρίς να κλείσουμε την console γράφουμε:


    sass _colors.scss mycolors.css

Στην περίπτωση που δεν θέλετε να εγκαταστήσετε όλα αυτά, απλά ενώστε πηγαίνετε στο SASS Online κάντε επικόλληση το περιεχόμενο του _variables.scss πρώτο και μετά το περιεχόμενο του _colors.scss, χωρίς το @import ‘variables’; και πατήστε Render. Κάντε αντιγραφή και επικόλληση το δημιουργημένο κώδικα και στο mycolors.css και έχετε ακριβώς το ίδιο αποτέλεσμα!

Έπειτα έχουμε δύο επιλογές, είτε να γράψουμε τον κώδικα για να κάνουμε register το νέο scheme στο functions.php του θέματος μας. Αλλά αν το θέμα δεν είναι δικό μας και δεν θέλουμε να χαθούν οι αλλαγές με κάποιο update. Επιλέγουμε τη λύση του plugin. Το plugin δεν θα το εξηγήσω γιατί είναι πολλά πράγματα που πρέπει να καταλάβετε επιπλέον αν δεν έχετε δουλέψει πολύ με wp, οπότε μιλάμε για το functions.php!

Μεταφέρουμε ή αντιγράφουμε το mycolors.css σε μία θέση στο φάκελο του θέματος μας. Στη δική μου περίπτωση στο φάκελο mytheme/stylesheets/.

Πηγαίνουμε στο functions.php και δημιουργούμε μία function add_mp6_themes (ότι όνομα θέλετε, βάζετε…)! Και κάνουμε επικόλληση των παρακάτω κώδικα, κάνοντας αντικατάσταση τα χρώματα:

function add_mp6_themes(){

   if ( is_plugin_active('mp6/mp6.php') && function_exists('wp_admin_css_color')) 
	{
	global $_wp_admin_css_colors;

    // MY COLOR SCHEME
	wp_admin_css_color(
	   'mythemename',
	   'My theme Label',
	   get_bloginfo('template_url') . "/stylesheets/mycolors.css",
	   array( '#222', '#333', '#b3296b', '#cc3a7e' )
	/* 
1 => $base-color,
2 => $icon-color,
3 => $highlight-color,
4 => 10% πιο ανοιχτό από το $highlight-color */
	);
	$_wp_admin_css_colors[ ''mythemename' ]->icon_colors = array( 
	    'base' => '#999',
	    'focus' => '#2ea2cc',
	    'current' => '#fff'
    ); /* Αντίστοιχα */
	}
}

//Και εκτελούμε την function με το add_action, όταν ξεκινάει να φορτώνει τη σελίδα διαχείρησης.
add_action( 'admin_init' , 'add_mp6_themes', 7 );

Σώζουμε της αλλαγές μας, και μπορείτε να πάτε στο users profile na διαλέξετε το νέο σας θέμα.








Hide ↑

Το αντικείμενο των σπουδών μου είναι η Μηχανολογία! Ασχολούμαι με τον προγραμματισμός σχεδόν από τα 14. Η πρώτες μου γλώσσες ήταν η QBasic και η Turbo Pascal. Από τα 16 και έπειτα έμαθα να δουλεύω με Visual Basic. Και με την έναρξη της φοιτητικής ζωής, ξεκίνησε η δουλειά πάνω σε C#, Java, php και javascript scripting και όλο το πακέτο του web development. Εκτός από το κερδοσκοπικό κομμάτι της δουλειάς μου ως developer . Δουλεύω πάνω σε opensource εφαρμογές και παραδείγματα κώδικα για την ενίσχυση της κοινότητας του ελληνικού development. Για περισσότερα, επισκεφτείτε το infogeek.gr!

Follow Κωνσταντίνος Τσατσαρούνος on Twitter ,

Git ή SVN, επιλογή version control

09 September 2013

Είμαι πολύ καιρό χρήστης του SVN και δεν το μετανιώνω! Ωστόσο το subversion control, είναι καλό στον έλεγχο τον αλλαγών ενός project που ξέρεις από που ξεκινάει[…]

Read more...

Κεντράροντας δυναμικά html elements μόνο με CSS!

08 June 2013

Ένα πράγμα που πρέπει να αναλογιστεί κανείς, είναι πόσες ώρες σπαταλάμε την ημέρα για να πετύχουμε ομαλή και responsive συμπεριφορά σε ότι σχεδιάζουμε.[…]

Read more...

Javascript Custom Events

06 May 2013

Ας υποθέσουμε ότι, έχουμε φτιάξει ένα αντικείμενο στο javascript, θεωρείστε το ως κλάση. Στο Javascript, ωστόσο, δεν υπάρχει το αντικείμενο της κλάσης,[…]

Read more...






Σχόλια

Δεν υπάρχουν σχόλια ακόμα.

Αφήστε ένα σχόλιο

 






RSS για τα σχόλια σε αυτό το άρθρο.  |  TrackBack URL



 
 
 

Eταιρείες παροχής υπηρεσιών διαδικτύου




 

Το Όραμά Μας

3d2 3d2

Η νέα εποχή ξεκινάει…

Είστε έτοιμοι;

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

Ξεκινάμε μια νέα εποχή για τα Ελληνικά δεδομένα. Κοιτάμε μπροστά και οραματίζομαστε το μέλλον με αισιοδοξία σε μία πολύ δύσκολη εποχή!

Αν είστε digital artist (web designer. web developer, programmer, 3d animator, graphic designer κτλ)  δώστε λίγα λεπτά από τον χρόνο σας να διαβάσετε το παρακάτω άρθρο. Σίγουρα σας ενδιαφέρει

 
web design forum

  • Προσεγγίστε νέους αναγνώστες και φίλους
  • Αποκτήστε το δικαίωμα να προωθήστε την σελίδα σας μέσω διαφημιστικών banner στο web design forum
  • Αποκτήστε συνδέσμους και backlinks δωρεάν
  • Αυτόματη προωθηση του άρθρου σας, σε διάφορες ιστοσελίδες κοινωνικής δικτύωσης.