Dva postranní panely ve Wordpress šabloně

Odkazy

Spřátelené weby

JoomlaDev.eu - Vše o vývoji CMS Joomla

Redakční systém WordPress - Nejlepší redakční systém zdarma - WordPress

Anketa

O jakém RS by jste chtěli více článků

	Joomla
	Drupal
	Wordpress
	Prestashop
	Zencart

Navigace: Úvodní strana

Wordpress

Články

Dva postranní panely ve Wordpress šabloně

Úterý, 03 Listopad 2009 19:46

Dnes si ukážeme jak vytvořit druhý postranní panel ve wordpress šabloně. Defaultní šablona obsahuje pouze jeden postranní panel. To někdy nemusí stačit, zvláště pokud například v pravém panelu zobrazíme reklamu, nemusí nám jeden stačit. Využijeme článek o tvorbě šablony a upravíme původní šablonu tak, aby měla druhý postranní panel na levé straně.

Jak tedy na to. Nejprve si zkopírujeme soubor sidebar.php, který je uložený v adresáři šablony. Nyní ho přejmenujeme třeba na sidebar-levy.php. Nyní si musíme říct co všechno chceme ve sloupci zobrazovat. V pravém sloupci v naší původní šabloně zobrazujeme kategorie a archív. Do levého menu si tedy vložíme třeba přihlašovací formulář a informace o uživateli, který je právě přihlášen.

Jdeme tedy na to otevřeme si náš nově vytvořené soubor a do něho vložíme tento kód:

<div id="panel">
<?php if (!(current_user_can('level_0'))){ ?>
 
<h2><?php _e('Přihlášení'); ?></h2>
<form action="<?php echo get_option('home'); ?>/wp-login.php" method="post">
<input type="text" name="log" id="log" value="<?php echo wp_specialchars(stripslashes($user_login), 1) ?>" size="20" />
<input type="password" name="pwd" id="pwd" size="20" />
<input type="submit" name="submit" value="Přihlásit" />
<p>
<label for="rememberme"><input name="rememberme" id="rememberme" type="checkbox" checked="checked" value="forever" /> Pamatuj si mne</label>
<input type="hidden" name="redirect_to" value="<?php echo $_SERVER['REQUEST_URI']; ?>" />
</p>
</form>
<a href="<?php echo get_option('home'); ?>/wp-login.php?action=lostpassword">Ztracené heslo?</a>
<?php } else { ?>
<h2>Odhlásit</h2>
<a href="<?php echo wp_logout_url(urlencode($_SERVER['REQUEST_URI'])); ?>">Odhlásit</a><br />
<a href="http://vasestranky.tld/wp-admin/">Admin</a>
<?php }?>
 
 
<h2><?php _e('Informace o uživateli'); ?></h2>
<?php
if (!(current_user_can('level_0'))){
echo 'Žádný uživatel není přihlášen';
}
else{
global $current_user;
get_currentuserinfo();
echo '<ul>';
echo '<li>Už. jméno: ' . $current_user->user_login . "</li>\n";
echo '<li>Email: ' . $current_user->user_email . "</li>\n";
echo '<li>Level: ' . $current_user->user_level . "</li>\n";
echo '<li>Jméno: ' . $current_user->user_firstname . "</li>\n";
echo '<li>Příjmení: ' . $current_user->user_lastname . "</li>\n";
echo '<li>Zobrazované jméno: ' . $current_user->display_name . "</li>\n";
echo '<li>ID: ' . $current_user->ID . "\n";
echo '</ul>';
}
?>
</div>
<h2>

Myslím, že kód ani moc vysvětlovat nemusím. Pokud je uživatel přihlášen zobrazí se mu odkazy na odhlášení a pod tím informace o něm. Pokud je uživatel odhlášen zobrazí se přihlašovací formulář a v informacích o uživateli so zobrazí, že není přihlášen viz. obrázky

wpsablo1

Nyní máme levé menu hotové, podívejme se tedy ještě na soubor index.php který musíme ještě trochu upravit. Otevřeme si ho a upravíme div s ID=obsah tatko:

<div id="obsah">
 <div id="levy">
 <?php get_sidebar('levy'); ?>
 </div>
 <div id="center">
 <h1>Obsah</h1>
 <?php if (have_posts()) : while (have_posts()) : the_post(); ?>
 <h1><?php the_title(); ?></h1>
 <h4>Posted on <?php the_time('F jS, Y') ?></h4>
 <p><?php the_content(__('(celý článek...)')); ?></p>
 <hr>
 <?php endwhile; else: ?>
 <p><?php _e('Sorry, no posts matched your criteria.'); ?></p>
 <?php endif; ?>
 </div>
 <div></div>
 </div>

Všimněme si hlavně funkce

get_sidebar('levy');

ta nám vkládá náš soubor sidebar-levy, již je všem jasné proč jsme soubor pojmenovali právě tak jak jsme ho pojmenovali, parametr funkce tvoří název souboru za pomlčkou. Nyní již máme panel v šabloně. Musíme ho ještě dostylovat v kaskádových stylech. Vložíme do souboru style.css tyto tvě definice:

#levy{
 float:left;
 width:200px;
}
#center{
 float:right;
 width:370px;
 
}

Tím by mělo být hotovo, samozřejmě by se měli nastavit nějaké okraje panelů a obsahové části, ale pro demonstraci určitě stačí.

Celá šablona nyní vypadá takto:

wpsabl3

Opět si můžete stáhnout celou šablonu pro kontrolu. V případě dotazů pište do diskuse.

Redakční systémy - Joomla, Wordpress, Drupal

Odkazy

Spřátelené weby

Anketa

Dva postranní panely ve Wordpress šabloně

Přidej Váš komentář

Vaše jméno:
Předmět:
Komentář: