WordPress Theme Options

Nov 10 2011

flattr this!

Manchmal ist es von Nöten, dass man dem User Optionen für das eigene Theme anbietet. Dies kann aus Design-Gründen, zum Beispiel für verschiedene Backgrounds oder auch eine Kategorieauswahl, zur Darstellung der Artikel in einer im Design integrierten Box.
In diesem Post möchte ich euch einen guten Weg aufzeigen, eure eigene Options-Seite für euer Theme zu bauen. Diese Seite wird ein Text-Feld beinhalten sowie eine Auswahl an verschiedenen Kategorien für eine Auflistung in einer Box. Der Clou an der Sache ist, dass wir alle Daten dieser Options-Page in einem einzigen Datenbank-Eintrag speichern.

 

Als allererstes erstellen wir eine Funktion, in welcher WordPress gesagt wird, dass wir nun eine neue Options-Page erstellen. Dadurch müssen wir uns nicht groß um die Speicherung der Daten kümmern.

//functions.php

//die funktion
function ctheme_options_init(){
  //Registrieren der Options "ctheme_theme", die Speichervariable in der Tabelle "ctheme_theme_options" und eine Validierungs-Funktion ("ctheme_options_validate", dazu später mehr)
  register_setting('ctheme_theme', 'ctheme_theme_options', 'ctheme_options_validate');
}

add_action('admin_init', 'ctheme_options_init');

 

Damit auch etwas dargestellt werden kann, benötigen wir eine do_page-Funktion. In dieser könnt ihr eine externe Datei inkludieren, um eine bessere Übersicht zu behalten. Ich schreibe es für dieses Tutorial direkt mit hinein.

<?php function ctheme_options_do_page(){
?>
<div class="wrap">
  <h2>cTheme Theme Optionen</h2>

  <form action="options.php" method="post">
    <?php //Schreibt verschiedene hidden Inputs
    settings_fields('ctheme_theme'); ?>
    <?php //Hier werden die gespeicherten Optionen abgefragt. Wir erinnern uns, dass wir alles in einem Eintrag speichern!
    $options = get_option('ctheme_theme_options'); ?>

    <table class="form-table">
      <tbody>
        <tr valign="top">
          <th scope="row">Titel der Box</th>
          <td><input type="text" value="" name="" id="" /></td>
        </tr>
        <tr>
          <th scope="row">Kategorie für die Auflistung in der Box</th>
          <td>Hier stehen dann die Kategorien..</td>
        </tr>
      </tbody>
    </table>

    <p class="submit"><input class="button-primary" type="submit" value="<?php _e('Save Changes') ?>" /></p>

    </form>
  </div>
<?php } ?>

Da wir alle Daten nur in einem Datenbankeintrag speichern, müssen wir die vom User eingegeben Daten selbst validieren.

function ctheme_options_validate($input){
	$input['boxtitle'] = ( $input['boxtitle'] == '' ) ? 'Standard-Box' : $input['boxtitle'];
	$input['categorylist'] = ( is_array( $input['categorylist'] ) ) ? $input['categorylist'] : array();
	return $input;
}

Nun müssen wir die Werte noch änderbar machen. Fangen wir mit der Input-Box an:

<tr valign="top">
  <th scope="row">Titel der Box</th>
  <td><input type="text" value="<?php echo $options['boxtitle']; ?>" name="ctheme_theme_options[boxtitle]" id="ctheme_theme_options_boxtitle" /></td>
</tr>

Wie Ihr seht, verwenden wir hier als name-Attribute den $options-Name als Array. (Hm, ist der Satz denn jetzt verständlich?)

Machen wir uns nun an die Auswahl der Kategorien. Dazu brauchen wir zwei Funktionen: Die eine listet alle Kategorien rekursive auf. Dafür ist es notwendig zu prüfen, ob die aktuelle Kategorie in der Schleife eine Unter-Kategorie hat, die zweite Funktion.

/***************
* list subcategories
* @categories wp-get_categories-Array
* @categoryId choosen category
* @label label to save in options
* @options the options
*******************/
function ctheme_options_listcategory( $categories, $categoryId, $label, &$options ) {
        //alle kategorien durchgehen, um die gewünschten Kategorien zu erhalten...
        // 0 gibt z.B. alle Top-Kategorien aus, 8 z.B. nur die, welcher eine Sub-Kategorie der Top-Kategorie 8 ist
	foreach( $categories as $category ):
                //Hat diese Kategorie die gewünschte ID?
		if( $category->category_parent == $categoryId ):
		?>
			<li>
				<input name="ctheme_theme_options[<?php echo $label; ?>][]" type="checkbox" value="<?php echo $category->term_id; ?>" <?php if(@in_array($category->term_id, $options[$label])) { echo 'checked="checked"'; } ?> /> <?php echo $category->name; ?>
				<?php
                                //Ruft nun die 2. Funktion auf, um zu prüfen, ob diese Kategorie weitere Kategorien enthält
                                if($subcats = ctheme_options_hassubcategory($categories, $category->term_id)): ?>
					<ul style="padding-left:20px; margin-bottom:14px;">
						<?php
                                                //Sollte dies der Fall sein, rufe ctheme_options_listcategory erneut auf
                                                ctheme_options_listcategory( $categories, $category->term_id, $label, $options ); ?>
					</ul>
				<?php endif; ?>
			</li>
	<?php endif;
	endforeach;
}

/* check, if the given categoryid is in the category-array */
function ctheme_options_hassubcategory( $categories, $categoryId ){
	$hasSubcategory = false;

	foreach( $categories as $category ) {
		if( $category->category_parent == $categoryId) {
			$hasSubcategory = true;
			break;
		}
	}

	return $hasSubcategory;
}

In unserer do_page-Funktion können wir die Kategorie-Funktion nun einfach mit dem Label, welchen wir in der Validierungs-Funktion angegeben haben, aufrufen.

<tr>
  <th scope="row">Kategorie für die Auflistung in der Box</th>
  <td>
    <?php
        //Alle Kategorien von WordPress mit hide_empty=0 abfragen... Wir benötigen alle Kategorien für die Optionen
        $allCategories = get_categories('hide_empty=0');

        ctheme_options_listcategory( $allCategories, 0, categorylist, $options );
    ?>
  </td>
</tr>

Als letztes müsst ihr die Options-Seite noch an die Theme-Navigation im Admin-Bereich hängen:

//register options page
add_action('admin_menu', 'ctheme_menu');

function ctheme_menu(){
	add_theme_page('cTheme Optionen', 'Optionen', 'edit_theme_options', 'ctheme-options', 'ctheme_options_do_page');
}

5 responses so far

Neustart!

Okt 10 2011

flattr this!

Nach sehr langer Pause auf diesem Blog wird in den nächsten (sicheren!) 3 Monaten immer wieder neues erscheinen.

Einige werden es noch nicht mitbekommen haben, dass ich nun mit Punkt 18 (.com) selbstständig bin. Gut, vor kurzem bekam ich einen recht großen Auftrag. Ich solle doch bitte ein Plugin für WordPress entwicklen. Gut, kein Ding, mach ich. In enger zusammenarbeit mit der Firma und deren Kunden wird das auch ein richtig schönes Ding! :)

Hier im Blog werde ich in der Zeit meine gesammelte Erfahrung, Lösungsansätze und Lösungen präsentieren. Für alle, die auch mal auf die selben Probleme stoßen.
Auch wird es eventuell ab und an ein kleines Plugin an sich für WordPress geben, welche ich zeitgleich entwickle, um eventuelle Probleme zu lösen.

Gerne sind natürlich Kommentare gesehen. Auch, wenn ihr natürlich möchtet, einen Beitrag über WordPress / PHP, welchen Ihr mir per E-Mail an blog@punkt16.de zukommen lassen könnt.

In diesem Sinne!:

$startedochendlich = new Blog();
 
$startedochendlich->starteJetzt('!!!');

No responses yet

ActionScript 3: Timeout

Apr 07 2010

flattr this!

Ich musste gerade für meinen Chef ein Coverflow für eine Messe anpassen. Das Problem: Es sollte sich automatisch bewegen. Dieses Coverflow tat das natürlich nicht! Also fix ein Timeout geschrieben, welches mir die “weiter”-Funktion alle x Sekunden aufruft!

import flash.events.TimerEvent;
import flash.utils.Timer;
 
var myTimer:Timer = new Timer(5000); //Timer-Klasse, alle 5 Sekunden
myTimer.addEventListener(TimerEvent.TIMER, myFunction); //Welche Funktion soll alle x Sekunden aufgerufen werden?
myTimer.start(); //Den Timer starten

One response so far

Das Buch-Spiel!

Dez 30 2009

flattr this!

Da Ich zurzeit so wenige Poste – Entschuldigung dafür! – gibt es ein kleines “Spiel”!

Continue Reading »

12 responses so far

PHP Kalender 1.1.1

Dez 17 2009

flattr this!

Version 1.1.1 des Punkt . 16 PHP Kalender!

Continue Reading »

No responses yet

The Incredible Polo

Dez 15 2009

flattr this!

Sie sehen aus wie vollgedröhnte Cracks. Es sind aber die einzig wahren Musiker!

Continue Reading »

One response so far

PHP Kalender

Dez 03 2009

flattr this!

Ein PHP-basierender Kalender, welcher den aktuellen Tag markiert.

Continue Reading »

One response so far

Enterseiten sinnvoll?

Dez 01 2009

flattr this!

Jeder ist bestimmt schonmal über sie gestolpert – die Enterseite. Oder wie man sie auch nennt: Willkommensseite, Eingangsseite oder Splashs-Seite.

Continue Reading »

No responses yet

Dein Online-Gedächtnis

Dez 01 2009

flattr this!

Unterwegs fallen einem oft die besten Dinge ein, man sieht, dass jemand sein Auto zu einem Spot-Preis verkauft – doch man kann sich meist nichts merken. Egal ob Termine, Ideen, Telefonnummern. Der Service Evernote ist dafür eine gute Lösung!

Continue Reading »

No responses yet

iPhone’s Tod: xPhone

Nov 21 2009

flattr this!

Ich muss sagen, ich bin Baff! Mehr als Baff! Das xPhone wird das iPhone von Apple definitiv “töten”. Schaut es euch an!

Continue Reading »

3 responses so far

Older posts »