1 sachin Jul 07, 2008 08:12
3 sachin 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 tilqicom 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 sachin 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' => ' • ',
'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' => ' • ',
) );
?>
<?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' => '<< '.T_('Previous'),
'next_text' => T_('Next').' >>',
) );
// ------------------------- 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 tilqicom Jul 07, 2008 22:34
add this somewhere in your style.css
#sidebar {
width: 180px;
float: left;
}
7 sachin Jul 08, 2008 00:10
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.
8 tilqicom 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 sachin 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 tilqicom 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 sachin 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.
12 sachin Jul 08, 2008 19:22
plz check my bolg http://www.smworldnet.com/md/blog6.php
now the bottom post are placed on leftside and top post are in the center
[FAQ] HOWTO edit / copy / add containers to skins:
http://forums.b2evolution.net/viewtopic.php?t=14515