Ondersteuning » Algemeen WordPress » php align right.

  • Opgelost martinschuitema

    (@martinschuitema)


    hoihoi..

    Ik had een zoekveld in mn blog in de sidebar staan, deze wou ik in de menubalk zetten, gelukt, alleen nu staat hij helemaal links uitgelijnd (align left) alleen hij met rechts in de menubalk staan, Hoe doe ik dit?

    <div id="menucontainer">
    	<div id="menu">
    			<ul>
    			<li><a href="<?php echo get_settings('home'); ?>">Home</a></li>
    			<?php wp_list_pages('title_li=&depth=4&sort_column=menu_order'); ?>
    			<?php include (TEMPLATEPATH . '/searchform.php'); ?>
    		    </ul>

    Het gaat dus om het onderste stuk <?php include (TEMPLATEPATH . ‘/searchform.php’); ?>

    Dank alvast

14 reacties aan het bekijken - 1 tot 14 (van in totaal 14)
  • Je moet kijken welke HTML code er gemaakt wordt…dan kun je dat stijlen in de stylesheet (style.css). Ik weet zo niet uit mijn hoofd welke code WP standaard genereert.

    Dus even in de bron kijken van je pagina.

    Zal denk ik iets zijn als:

    <div class="search-box">

    Thread starter martinschuitema

    (@martinschuitema)

    Als ik on de broncode kijk staat dit er:

    <div id="search">
    			<form method="get" id="searchform" action="http://fcgroningenblog.nl">
    				<input id="s" type="text" name="s" value="" widdit="on" autocomplete="off">
    			<input id="searchsubmit" type="submit" value="Search">
    			</form><div id="predictad_div" class="predictad"></div>
    </div>
    Thread starter martinschuitema

    (@martinschuitema)

    Hier zie je even de style.css van het gebied ‘search’:

    /* The Search */
    
    #search {
    	height:30px;
    	width:320px;
    	margin-top:0px;
    	margin-bottom:6px;
    	padding:3px 0px 5px 5px;
    	float:right;
    	display: inline;
    	background: #008b59;
    }
    
    #search form {
    	margin: 0;
    	padding: 0;
    }
    
    #search fieldset {
    	margin: 0;
    	padding: 0;
    	border: none;
    }
    
    #search p {
    	margin: 0;
    	font-size: 85%;
    }
    
    #s {
    	float: left;
    	width:160px;
    	padding: 4px 5px 4px 5px;
    	background:#ececec;
    	border:1px solid #464f46;
    	font: normal 100% "Tahoma", Arial, Helvetica, sans-serif;
    	color:#000;
    	margin-right:2px;
    	margin-top:3px;
    
    	}
    
    input#searchsubmit {
    	width:70px;
    	float: right;
    	background:#732C7B;
    	border:1px solid #421C52;
    	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    	color: #FFFFFF;
    	height:23px;
    	line-height:20px;
    	margin-right:74px;
    	margin-top:4px;
    }
    Thread starter martinschuitema

    (@martinschuitema)

    En nu?

    Thread starter martinschuitema

    (@martinschuitema)

    Yasp0 wat moet ik nu doen?

    Thread starter martinschuitema

    (@martinschuitema)

    Iemand die mij kan helpen???

    Er zit wel een float:right op #search zie ik…vreemd. Er is wel ruimte voor de div? Omdat hij 320px breed is.

    Heb je wat online staan? Dat maakt het stuk makkelijker.

    Thread starter martinschuitema

    (@martinschuitema)

    Ik heb http://www.fcgroningenblog.nl ff online gezet.

    Kijk eens hoe de pagina is opgebouwd.

    Je hebt een #menucontainer met daarbinnen #menu, die je menu weergeeft in een lijst. Dat is prima. Maar binnen die lijst roep je dan de zoekbalk (#search) op. Dat is niet logisch. Je wilt eerst je menu en dan je zoekbalk…en die moeten vervolgens naast elkaar worden geplaats (float:left voor menu…en float:right voor search).

    Daarom is de weergave nu ook niet goed…

    Zo is het nu:

    <div id="menucontainer">
       <div id="menu">
          <ul>
             <li></li>
             <div id="search">
             </div>
          </ul>
       </div>
    </div>

    Een logisch opbouw is:

    <div id="menucontainer">
       <div id="menu">
          <ul>
             <li></li>
          </ul>
       </div>
       <div id="search">
       </div>
    </div>

    Thread starter martinschuitema

    (@martinschuitema)

    Waarom kan ik dit bovenstaaande nergens vinden in de header?

    Thread starter martinschuitema

    (@martinschuitema)

    Het was zo:

    <div id="menucontainer">
    	<div id="menu">
    			<ul>
    			<li><a href="<?php echo get_settings('home'); ?>">Home</a></li>
    			<?php wp_list_pages('title_li=&depth=4&sort_column=menu_order'); ?>
    			<?php include (TEMPLATEPATH . '/searchform.php'); ?>
    		    </ul>
    </div>
    </div>

    En nu zo:

    <div id="menucontainer">
    	<div id="menu">
    			<ul>
    			<li><a href="<?php echo get_settings('home'); ?>">Home</a></li>
    			<?php wp_list_pages('title_li=&depth=4&sort_column=menu_order'); ?>
    			</ul>
    	</div>
    	<?php include (TEMPLATEPATH . '/searchform.php'); ?>
    	</div>
    </div>

    En de site doet nu heel raar: http://www.fcgroningenblog.nl

    Thread starter martinschuitema

    (@martinschuitema)

    Gelukt, alleen nu staat hij nog niet helemaal recht, kan ook zijn omdat ik de grootte van de zoekbalk heb verkleind, hoe gaat dit goed?

    Thread starter martinschuitema

    (@martinschuitema)

    Dit is de CSS:

    /* The Search */
    
    #search {
    	height:30px;
    	width:320px;
    	margin-top:0px;
    	margin-bottom:6px;
    	padding:3px 0px 5px 5px;
    	float:right;
    	display: inline;
    	background: #008b59;
    }
    
    #search form {
    	margin: 0;
    	padding: 0;
    }
    
    #search fieldset {
    	margin: 0;
    	padding: 0;
    	border: none;
    }
    
    #search p {
    	margin: 0;
    	font-size: 85%;
    }
    
    #s {
    	float:left;
    	width:160px;
    	padding: 4px 5px 4px 5px;
    	background:#ececec;
    	border:1px solid #464f46;
    	font: normal 100% "Tahoma", Arial, Helvetica, sans-serif;
    	color:#000;
    	margin-right:2px;
    	margin-top:3px;
    
    	}
    
    input#searchsubmit {
    	width:70px;
    	float:right;
    	background:#732C7B;
    	border:1px solid #421C52;
    	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    	color: #FFFFFF;
    	height:23px;
    	line-height:20px;
    	margin-right:6px;
    	margin-top:4px;
    }
    Thread starter martinschuitema

    (@martinschuitema)

    Opgelost!

    Bedankt Voor de hulP!!

14 reacties aan het bekijken - 1 tot 14 (van in totaal 14)
  • Het onderwerp ‘php align right.’ is gesloten voor nieuwe reacties.