Statische Seite anpassen!

Buegel

Hallöle!
hab viel im Forum gesucht, aber leider nix passendes gefunden.

Simples Problem:
Ich hab eine statische Seite erstellt auf der ich eine Bildergalerie erstellen will.
Hierzu hab ich meine Page.php kopiert und das Ergebniss fuer die neue Seite als Seitentemplate benutzt. Bis hierher alles prima gelaufen :-) siehe SY Lauan - Logbuch
Wie man dort sieht hab ich die Sidebars rausgeschmissen, da ich sie dort nicht brauche.
Abba: Nun haette ich natuerlich das Post-Fenster groesser. Und genau da hab ich grad nen Pfropfen im Gehirn.
Ich als Rookie wuerde mir jetzt die style.css hernehmen, sie kopieren und speziell fuer die neue Seite anpassen. Nur .... wie mache ich es, das dann die neue css nur fuer diese Seite aufgerufen wird????

oder geht das alles irgendwie ganz anders??ß Wie gesagt .. ich will nur die postbox vergroessern.

hier mal der code:

PHP

<?php
/*
Template Name: Lauan.php
*/
?> 


<?php get_header(); ?>


<div id="page_container">
<div id="postcol" class="fixheight">
<div id="pc_t" class="fixheight">
<div id="pc_r" class="fixheight">
<div id="pc_b" class="fixheight">
<div id="pc_l" class="fixheight">
<div id="pctl" class="fixheight">
<div id="pctr" class="fixheight">
<div id="pcbr" class="fixheight">
<div id="pcbl" class="fixheight">
<div id="pc_c" class="fixheight">




<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
    <div class="postbox">
    <div class="right">
    <div class="bottom">
    <div class="left">
    <div class="post_title">
        <div class="top">
        <div class="right">
        <div class="left">
        <div class="tl">
        <div class="tr">
        <h2 id="post-<?php the_ID(); ?>" class="title"><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title(); ?>"><?php the_title(); ?></a></h2>
        </div>
        </div></div></div></div></div> <?php /* post_title */ ?>
    <div class="br">
    <div class="bl">
    <div class="content">    <?php the_content(); ?>


    </div></div></div></div></div></div></div> <?php /* postbox */ ?>
<?php endwhile; ?>
<div class="navigation">


</div> <?php /* navigation */ ?>
<div style="clear: both"></div>
<?php else : ?>
    <h2 class="center">nix gefunden </h2>
    <p class="center"><?php _e("Sorry, gibt es hier nicht."); ?></p>




<?php endif; ?>
<?php get_footer(); ?>

Alles anzeigen

thx a lot Micha

Werbepost

Hallo!

Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
✔️ Deutsche Server & DSGVO-konform
✔️ Persönlicher Support (kein 0815-Ticket-System)

Mehr erfahren

marX

Guck dir mal an, wie das im Standardtheme (Kubrik) gelöst ist - da gibts die Klassen "widecolumn" (Templates ohne Sidebar) und "narrowcolumn" (Templates mit Sidebar).

Buegel

puhhh .... das hab ich mir angeschaut und mal nen bisschen damit rumgespielt. Dummerweise sieht meine css (von der ich si ziemlich Doppel Null Ahnung habe) an der wohl zu bearbeitenden Stelle folgendermassen aus:

PHP

/******************************
 *** Columns and Containers ***
 ******************************/


#page_container {
    position: relative;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 20px;
    font-size: 1.2em;
    }


#postcol {
    background: #f7f7f7;
    }
#pc_t { background: url(images/postcolT.jpg) repeat-x top; }
#pc_r { background: url(images/postcolR.jpg) repeat-y right; }
#pc_b { background: url(images/postcolB.jpg) repeat-x bottom; }
#pc_l { background: url(images/postcolL.jpg) repeat-y left; }
#pctl { background: url(images/postcolTL.jpg) no-repeat top left; }
#pctr { background: url(images/postcolTR.jpg) no-repeat top right; }
#pcbr { background: url(images/postcolBR.jpg) no-repeat bottom right; }
#pcbl { background: url(images/postcolBL.jpg) no-repeat bottom left; }
#pc_c { padding: 15px; }


.postbox {
    margin: 15px 0px 15px 0px;
    padding: 0px;
    background: white;
    }
.postbox .right { background: url(images/postboxR.jpg) repeat-y right; }
.postbox .bottom { background: url(images/postboxB.jpg) repeat-x bottom; }
.postbox .left { background: url(images/postboxL.jpg) repeat-y left; }
.postbox .br { background: url(images/postboxBR.jpg) no-repeat bottom right; }
.postbox .bl { background: url(images/postboxBL.jpg) no-repeat bottom left;}
.post_title { background: #EBF4F3; }
.post_title .top { background: url(images/post_titleT.jpg) repeat-x top; }
.post_title .right { background: url(images/post_titleR.jpg) repeat-y right; }
.post_title .left { background: url(images/post_titleL.jpg) repeat-y left; }
.post_title .tl { background: url(images/post_titleTL.jpg) no-repeat top left; }
.post_title .tr { background: url(images/post_titleTR.jpg) no-repeat top right; }
.postbox .content {
    margin: 0px 15px 0px 15px;
    padding: 0px;
    font-size: 1.2em;
    }


.navigation { margin: 15px 0px 15px 0px; }


/************
 *** Post ***
 ************/


h2.title {
    margin: 0px;
    padding: 10px 15px 0px 15px;
    letter-spacing: 1px;
    font-weight: normal;
    line-height: 1.5em;
    font-size: 1.6em;
    }


h2.title a {
    color: #333333;
    text-decoration: none;
    }


h2.title a:hover { text-decoration: underline; }


small.title {
    margin: -10px 0px 0px 0px;
    padding: 0px 15px 0px 15px;
    font-size: 0.9em;


    color: #777777;
    }


.postmetadata {
    text-align: center;
    padding: 0px 0px 15px 0px;
    margin: 0px;
    color: #777777;
    font-size: 0.8em;
    }


blockquote {
    color: #777;
    display: block;
    margin: 15px 30px 0 10px;
    padding-left: 20px;
    background: url(images/quote.gif) no-repeat left top;
    }


cite {
    margin: 5px 0 0;
    display: block;
    }


strike {
    color: #777;
    }


code {
    font: 1.1em 'Courier New', Georgia, Fixed, Sans-Serif;
    }


.postbox .content img {
    padding: 0;
    max-width: 100%;
    }


img.centered {
    display: block;
    margin-left: auto;
    margin-right: auto;
    }


img.alignright {
    padding: 4px;
    margin: 0 0 2px 7px;
    display: inline;
    }


img.alignleft {
    padding: 4px;
    margin: 0 7px 2px 0;
    display: inline;
    }


.postbox .content h1 {
    font-size: 1.6em;
    font-weight: normal;
    letter-spacing: 1px;
    margin-top: 1.25em;
    }


.postbox .content h2 {
    font-size: 1.4em;
    font-weight: normal;
    letter-spacing: 1px;
    margin-top: 1.25em;
    }


.postbox .content h3 {
    font-size: 1.25em;
    font-weight: normal;
    letter-spacing: 1px;
    }


.postbox .content h4 {
    font-size: 1em;
    }


.postbox .content p {
    margin-top: 1em;
    margin-bottom: 1em;
    }




.......

Alles anzeigen

... macht mich ein wenig konfus :-(

Wo muss ich denn wohl ansetzen?

Ich hab mir zwar jetzt mal eine eigene .widecolum gebaut, aber irgendwie passiert alles ... nur nicht das gewünschte :-(
Naja ... Wochenende steht ja vor der Tür und da hab ich zeit zum basteln.

thx Micha

Monika

dein theme glaube ich hat mehrere style.css en ;)

Code

#header { width: 980px; }


#page_container { width: 980px; }


#postcol {
	width: 470px;
	margin-left: auto;
	margin-right: auto;
	}


#leftbar {
	position: absolute;
	left: 0px;
	width: 250px;
	background: #EAEDF2;
	}

Alles anzeigen

http://www.weltumsegelung.net/Blog/wp-conten…-0100/style.css

an der Stelle:

PHP

<?php
/*
Template Name: Lauan.php
*/
?> 


<?php get_header(); ?>


<div id="page_container">
<div id="postcol" class="fixheight">
<div id="pc_t" class="fixheight">

Alles anzeigen

tippst Du nur in dieser einen page

statt postcol

postcolbilder rein

dann tippst Du in der obigen style.css

HTML

#postcolbilder {
	width: 900px;
	margin-left: auto;
	margin-right: auto;
	}

könnte klappen

hoff ich

lg

Buegel

Hallöle!
Vielen dank für den Tip!
leider hat auch das nicht gaaanz das gewünschte ergebnis erziehlt :-(

SY Lauan - Logbuch

Aber ich bin schon näher dran. Vielleicht probiere ich in der style.css auch noch ein wenig mit widecolum rum :-)

thy a lot Micha

Buegel

Ok ... ich bin ein wenig weiter :-) SY Lauan - Logbuch

leider krieg ich es nicht breiter.

was habe ich gemacht?

style.css habe ich folendermassen geaendert:

PHP

#header { width: 980px; }


#page_container { width: 980px; }


#postcol {
    width: 470px;
    margin-left: auto;
    margin-right: auto;
    }


#leftbar {
    position: absolute;
    left: 0px;
    width: 250px;
    background: #EAEDF2;
    }


#postcolseite {
    width: 100%;
    }

Alles anzeigen

meine eigene page template folgendermassen modifiziert:

PHP

<?php
/*
Template Name: Lauan.php
*/
?> 




<?php get_header(); ?>


<div id="page_container">








<div id="postcol" class="fixheight">
<div id="postcolseite" class="fixheight">
<div id="pc_t" class="fixheight">
<div id="pc_r" class="fixheight">
<div id="pc_b" class="fixheight">
<div id="pc_l" class="fixheight">
<div id="pctl" class="fixheight">
<div id="pctr" class="fixheight">
<div id="pcbr" class="fixheight">
<div id="pcbl" class="fixheight">
<div id="pc_c" class="fixheight">
<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
    <div class="postbox">
    <div class="right">
    <div class="bottom">
    <div class="left">
    <div class="post_title">
        <div class="top">
        <div class="right">
        <div class="left">
        <div class="tl">
        <div class="tr">
        <h2 id="post-<?php the_ID(); ?>" class="title"><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title(); ?>"><?php the_title(); ?></a></h2>
        </div>
        </div></div></div></div></div> <?php /* post_title */ ?>
    <div class="br">
    <div class="bl">
    <div class="content">    <?php the_content(); ?>
    <p class="postmetadata"></p>
    </div></div></div></div></div></div></div> <?php /* postbox */ ?>
<?php endwhile; ?>
<div class="navigation">
<div class="alignleft"><?php posts_nav_link('','','&laquo; Previous Entries') ?></div>
<div class="alignright"><?php posts_nav_link('','Next Entries &raquo;','') ?></div>
</div> <?php /* navigation */ ?>
<div style="clear: both"></div>
<?php else : ?>
    <h2 class="center">nix gefunden </h2>
    <p class="center"><?php _e("Sorry, gibt es hier nicht."); ?></p>
<?php endif; ?>
<?php get_footer(); ?>

Alles anzeigen

Tja .. das war es dann auch schon. Ein erhoehen von postcolseite bringt leider nix, da sich die Page irgendwie immer noch an den - nicht mehr vorhandenen - Sidebardimensionen zu orientieren scheint?!

Aber ich hatte folgendes ausprobiert.
In der style.css habe ich einfach mal das postcol von 470px auf 100% gesetzt. das brachte genau das gewuenschte Ergebnis :-) Dummerweise aber natuerlich auch fuer den rest des Blogs :-) :-)

Meine frage waere jetzt ... kann ich nicht einfach in meinem pagetemplate ein modifiziertes style.css aufrufen, welches NUR fuer diese seite gilt??

thx micha

Monika

HeadSpace2: Advanced meta-data manager for SEO titles, tags, descriptions, and more | Urban Giraffe

das kann das ganz einfach

naja die Dokumentation im Autorenblog lesen hilft ;)

lg

Buegel

Oh Supi!!
Danke .. das schau ich mir gleich mal an.

thx micha

Willkommen! Melden Sie sich an oder registrieren Sie sich.

Statische Seite anpassen!

Jetzt mitmachen!