Recent Topics

1 Jul 07, 2008 08:12    

hello
in pinkblossom skin i have changed the sidebar position from right side to left side & reduced the site size from 900px to 700px all by editing .css file.
now i like to add 2nd sidebar on rt side starting at top of the site and i want to place complet site to left margin, now which is in the center.
plz help me out
thank you
sachin

3 Jul 07, 2008 18:17

ty
it is a good article. i will try that today. but still i am having one question, how to fix the left margin of the site. i like to place it on left corner of the browser.

4 Jul 07, 2008 18:38

after adding your container, once you are complete with them, we d need a link to your website to see how it looks like, then we may be able to help you place them

5 Jul 07, 2008 20:21

i messed up. coding is not my field. sorry for troubling you guys. now .css file looks body

{
	background: url(images/background.gif) repeat-x #afa907;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 8pt;
	color: #ffffff;
	margin-top: 10px;
}
#wrap {
	width: 900px;
	text-align:left;
}
#header {
	background: url(images/background_header.gif) no-repeat;
	height: 200px;
	margin-bottom: 2px;
}
#title {
	float: left;
	background-color: #7d7904;
	padding: 10px;
	float: left;
	margin: 20px 0px 0px 5px;
} 
#topright {
	float: right;
	margin: 20px 20px 0px 0px;
}
#navigation {
	clear: both;
	background: url(images/background_nav.gif) repeat-y;
	border-top: 1px solid #bab100;
	border-bottom: 1px solid #bab100;
	padding: 3px 0px 5px 0px;
	text-align: center;
	font-size: 10pt;
	font-weight: bold;
}
#sidebar_left {
	margin: 20px 0px 0px 0px;
	float: left;
	width: 180px;
}

#content {
	margin: 20px 0px 0px 0px;
	color: #474404;
}
#footer {
	clear: both;
	background: url(images/background_footer.gif) repeat-x #9a9506;
	padding: 15px 0px;
	width: 900px;
	text-align: center;
	color: #ffffff;
}
.post{
	background:url(images/background_entry.gif) repeat-x #9b9505;
	width: 500px;
	margin-bottom: 15px;
	

}
.entry {
	padding: 0px 15px;	
/*	width: 450px; */
}

#sidebar_right {
	margin: 20px 0px 0px 0px;
	width: 180px;
}

and index.main.php looks


// ----------------------------- END OF "Header" CONTAINER -----------------------------
			?>
       	  </div>
          <div id="topright">
          <?php if ( true /* change to false to hide the search box */ ) { ?>
		  <form action="<?php $Blog->gen_blogurl() ?>" method="get" class="search">
			<input name="s" size="25" value="search..." class="form_text_input" type="text" />
		  </form>
				<?php } ?>
          </div>
      </div><!-- end of header -->
      <div id="navigation">
        <ul>
          <?php
					// ------------------------- "Menu" CONTAINER EMBEDDED HERE --------------------------
					// Display container and contents:
					// Note: this container is designed to be a single <ul> list
					skin_container( NT_('Menu'), array(
							// The following params will be used as defaults for widgets included in this container:
							'block_start'         => '',
							'block_end'           => '',
							'block_display_title' => false,
							'list_start'          => '',
							'list_end'            => '',
							'item_start'          => '<li>',
							'item_end'            => '</li>',
						) );
					// ----------------------------- END OF "Menu" CONTAINER -----------------------------
				?>
        </ul>
      </div><!-- end of navigation -->
     





<?php
// ------------------------- SIDEBAR INCLUDED HERE --------------------------
skin_include( '_sidebar_left.inc.php' );
// Note: You can customize the default BODY footer by copying the
// _body_footer.inc.php file into the current skin folder.
// ----------------------------- END OF SIDEBAR -----------------------------
?>








      <div id="content">
      	<?php
	// ------------------------- MESSAGES GENERATED FROM ACTIONS -------------------------
	messages( array(
			'block_start' => '<div class="action_messages">',
			'block_end'   => '</div>',
		) );
	// --------------------------------- END OF MESSAGES ---------------------------------
	?>


	
	<?php	// ---------------------------------- START OF POSTS --------------------------------------
		// Display message if no post:
		display_if_empty();

		while( $Item = & mainlist_get_item() )
		{	// For each blog post, do everything below up to the closing curly brace "}"
		?>



			<div id="<?php $Item->anchor_id() ?>" lang="<?php $Item->lang() ?>">
			<div class="post">
			<?php
				$Item->locale_temp_switch(); // Temporarily switch to post locale (useful for multilingual blogs)
			?>

			<h1>

				<a href="<?php $Item->permanent_url() ?>" title="<?php echo T_('Permanent link to full entry') ?>"></a>
				<?php $Item->title(); ?>
			</h1>

			<div class="entry">
				<?php
					// ---------------------- POST CONTENT INCLUDED HERE ----------------------
					skin_include( '_item_content.inc.php' );
					// Note: You can customize the default item feedback by copying the generic
					// /skins/_item_feedback.inc.php file into the current skin folder.
					// -------------------------- END OF POST CONTENT -------------------------
				?>


             </div>

				<div class="postmetadata">
                				<?php
					$Item->categories( array(
						'block_start'          => '<div>'.T_('Categories').': ',
						'block_end'           => '</div>',
						'include_main'    => true,
						'include_other'   => true,
						'include_external'=> true,
						'link_categories' => true,
					) );
				?>
					<?php
						// Link to comments, trackbacks, etc.:
						$Item->feedback_link( array(
										'type' => 'feedbacks',
										'link_before' => '',
										'link_after' => ' &bull; ',
										'link_text_zero' => '#',
										'link_text_one' => '#',
										'link_text_more' => '#',
										'link_title' => '#',
										'use_popup' => false,
									) );
					?>

					<?php
						$Item->edit_link( array( // Link to backoffice for editing
								'before'    => '',
								'after'     => ' &bull; ',
							) );
					?>

					<?php $Item->permanent_link(); ?>
				</div>


			
			<?php
				// ------------------ FEEDBACK (COMMENTS/TRACKBACKS) INCLUDED HERE ------------------
				skin_include( '_item_feedback.inc.php', array(
						'before_section_title' => '<h4>',
						'after_section_title'  => '</h4>',
					) );
				// Note: You can customize the default item feedback by copying the generic
				// /skins/_item_feedback.inc.php file into the current skin folder.
				// ---------------------- END OF FEEDBACK (COMMENTS/TRACKBACKS) ---------------------
			?></div>

			<?php
				locale_restore_previous();	// Restore previous locale (Blog locale)
			?>

			

	<?php } // --------------------------------- END OF POSTS ----------------------------------- ?>


	<?php
		// -------------- MAIN CONTENT TEMPLATE INCLUDED HERE (Based on $disp) --------------
		skin_include( '$disp$', array(
				'disp_posts'  => '',		// We already handled this case above
				'disp_single' => '',		// We already handled this case above
				'disp_page'   => '',		// We already handled this case above
			) );
		// Note: you can customize any of the sub templates included here by
		// copying the matching php file into your skin directory.
		// ------------------------- END OF MAIN CONTENT TEMPLATE ---------------------------
	?>









<?php
// ------------------------- SIDEBAR INCLUDED HERE --------------------------
skin_include( '_sidebar_right.inc.php' );
// Note: You can customize the default BODY footer by copying the
// _body_footer.inc.php file into the current skin folder.
// ----------------------------- END OF SIDEBAR -----------------------------
?>

</div>
	
	<div align="center">
		<?php
			// -------------------- PREV/NEXT PAGE LINKS (POST LIST MODE) --------------------
			mainlist_page_links( array(
					'block_start' => '<p class="center">',
					'block_end' => '</p>',
					'links_format' => '$prev$ :: $next$',
   				'prev_text' => '&lt;&lt; '.T_('Previous'),
   				'next_text' => T_('Next').' &gt;&gt;',
				) );
			// ------------------------- END OF PREV/NEXT PAGE LINKS -------------------------
		?>


and ie.css file looks

#title {
	margin: 20px 0px 0px 3px;
} 
#topright {
	margin: 20px 10px 0px 0px;
}
#sidebar_left {
	width: 170px;
	padding-left: 10px;
}
.post{
	margin-bottom: 0px 0px 15px 0px;
	padding: 0px;
}
#sidebar_right {
	width: 170px;
	padding-left: 10px;

the website is underconstruction. please check http://www.smworldnet.com/md/blog6.php[/code]

thank you

6 Jul 07, 2008 22:34

add this somewhere in your style.css

#sidebar {
width: 180px;
float: left;
}

8 Jul 08, 2008 00:22

sachin wrote:

ty
got it right. but now i have to format the sidebar 2 and sidebar 2 (right) is lower than sidebar 1 (leftside). i am expecting your help. plz have a look
http://www.smworldnet.com/md/blog6.php.

sure, only if you could be more descriptive what you mean having it lower.. if you want it from a lower position, you can use position: absolute

9 Jul 08, 2008 00:45

the content in the right sidebar starts lower than the contents in the left sidebar. and can u plz tell me how to format the content in the right sidebar.
color, position of the text and fonts are different. may i know what is ul & h stands for.

10 Jul 08, 2008 01:08

sachin wrote:

the content in the right sidebar starts lower than the contents in the left sidebar. and can u plz tell me how to format the content in the right sidebar.
color, position of the text and fonts are different. may i know what is ul & h stands for.

aah, i ve just noticed what you mean now.. it's because right sidebar doesnt even has its own div.

and the left has div "sidebar" not "sidebar_left" as you wanted it to be..

you need to open up your _sidebar.right.php (or summat) add <div id="sidebar_right"> (or whatever) before the start of container to style the right sidebar and do not forget to add </div> after the end of container

*renaming the sidebar.php to "sidebar_left.php" doesnt mean that you can style it using #sidebar_left.. you have to add the div..

unless you cant handle it, you may want to ctrl c+v your both sidebar files.good luck with it

11 Jul 08, 2008 02:40

thank you very much
next part lol
i would like to keep the website margin to left. now which is in the center, if i use bigger screen.


Form is loading...