Please login or register.

Login with username, password and session length
Advanced search  

News:

Latest sNews - sNews 1.7 - with its own forums - for discussion and user mods.

Author Topic: how to add another column (left column)? pls  (Read 2875 times)

adminphp

  • Full Member
  • ***
  • Karma: 4
  • Posts: 150
  • you must be a great snewser .
how to add another column (left column)? pls
« on: May 15, 2011, 02:35:17 AM »

He every one in this amazing forum .. first of all i have a template of my cms  with one column (right) and content (main) 
so i want to add left sidebar(column)  just from css file with (div) ID in my index.php
can any one  give us the way to do that .. and thanks to all members in this forum specially admins who really did a good task in this forum

if it's necessary .. i cant give you my (css file) and (index file) to put the modification on it.
Logged
Fifty years of programming language research, and we end up with C++?

adminphp

  • Full Member
  • ***
  • Karma: 4
  • Posts: 150
  • you must be a great snewser .
Re: how to add another column (left column)? pls
« Reply #1 on: May 15, 2011, 02:56:10 AM »

this is index.php file ;

Code: [Select]
<?php session_start(); include('snews.php'); ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<!-- Designed by: v9v9.net -->

<head>
<?php title(); ?>
<meta name="Robots" content="index,follow" />
<meta name="Generator" content="sNews 1.6" />
<link rel="stylesheet" type="text/css" href="indexstyle.css" media="screen" />
<link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="rss-articles/" />
<link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="rss-pages/" />
<link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="rss-comments/" />
</head>

<body>
<div id="container">

<div id="header">

<div id="search">
<?php searchform(); ?>
</div>

<h1><a title='<?php echo s('website_title'); ?>' href="index.php"><?php echo s('website_title'); ?></a></h1>
<h2><?php echo s('website_description'); ?></h2>
</div>


<div id="content">

<div id="menu">
<?php pages(); ?>
<li> <?php login_link(); ?></li>
</div>


<div id="sidebar">
<h1> :</h1>
<ul>
<?php categories(); ?>
</ul>
<?php extra(); ?>
<h1> :</h1>
<ul>
<?php menu_articles(0,5); ?>
</ul>
<h1> :</h1>
<ul>
<?php new_comments(520); ?>
</ul>
<h1> :</h1>
<ul>
<?php rss_links(); ?>
</ul>
</div>


<div id="main">
<?php center(); ?>
</div>


<div id="bottom">
&nbsp;
</div>

</div>

<div id="footer">

<p id="right">
<a title='<?php echo s('website_title'); ?>' href="index.php"><?php echo s('website_title'); ?></a> 2011
</p>
</div>

</div>

</body>

</html>
Logged
Fifty years of programming language research, and we end up with C++?

Keyrocks

  • Doug
  • ULTIMATE member
  • ******
  • Karma: 449
  • Posts: 6019
  • Semantically Challenged
    • snews.ca
Re: how to add another column (left column)? pls
« Reply #2 on: May 15, 2011, 04:52:52 PM »

You will need to provide all the CSS for this template too, so any member able to help you will be able to install this and have it displaying as it should.
Logged
Do it now... later may not come.
-------------------------------------------------------------------------------------------------
sNews 1.6 MESU | sNews 1.6 MEMU

adminphp

  • Full Member
  • ***
  • Karma: 4
  • Posts: 150
  • you must be a great snewser .
Re: how to add another column (left column)? pls
« Reply #3 on: May 16, 2011, 12:59:47 AM »

You will need to provide all the CSS for this template too, so any member able to help you will be able to install this and have it displaying as it should.

yeah keyrocks its very simple to add a new column to this template we just have to use some Divs ID in index.php  and  divs in css file.
i had knownhow to do that but the problem is when i add another sidebar in my template actually it works but it has some bugs which i have to fix it.
i want to know where we can put div left and div right  is it;  after main's div or before  or;
div right
div main
div left

i've tried all things to add it but it doesn't work well.. if you need my css file i can give it to you.
Logged
Fifty years of programming language research, and we end up with C++?

Keyrocks

  • Doug
  • ULTIMATE member
  • ******
  • Karma: 449
  • Posts: 6019
  • Semantically Challenged
    • snews.ca
Re: how to add another column (left column)? pls
« Reply #4 on: May 17, 2011, 03:04:41 AM »

if you need my css file i can give it to you.

Yes, anyone helping you would need both files, since index.php needs its CSs in order to display properly.
Logged
Do it now... later may not come.
-------------------------------------------------------------------------------------------------
sNews 1.6 MESU | sNews 1.6 MEMU

adminphp

  • Full Member
  • ***
  • Karma: 4
  • Posts: 150
  • you must be a great snewser .
Re: how to add another column (left column)? pls
« Reply #5 on: May 18, 2011, 12:46:46 AM »

if you need my css file i can give it to you.

Yes, anyone helping you would need both files, since index.php needs its CSs in order to display properly.

if its necessary take this css file and index file is above

Code: [Select]
BODY {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: -17px auto; FONT: bold 13pt arial; COLOR: #000000; DIRECTION: rtl; PADDING-TOP: 0px; BACKGROUND-COLOR: #999999; TEXT-ALIGN: center
}
A {
COLOR: #000080; TEXT-DECORATION: none
}

.tblFooterChannels
{
vertical-align: sub;
}
.tblFooterChannels a
{
font-family: Traditional Arabic; /* Arabic Transparent;*/

font-weight: bold;
color: #3366FF;
text-decoration: none;
}

extracss {
COLOR: #FFFFFF; TEXT-DECORATION: none; text-align:center font-size: 11pt;
}
A:hover {
COLOR: red; TEXT-DECORATION: none
}
IMG {
BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; BORDER-RIGHT-WIDTH: 0px
}
#container {
BACKGROUND: url(images/contentbg.gif) repeat-y; MARGIN: 0px auto; WIDTH: 800px
}
#content {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px auto; WIDTH: 580px; PADDING-TOP: 0px
}
#header {
BACKGROUND: url(images/header.gif) repeat-y; HEIGHT: 100px; TEXT-ALIGN: right
}
#header H1 {
PADDING-RIGHT: 30px; PADDING-LEFT: 0px; PADDING-BOTTOM: 10px; MARGIN: 0px auto; FONT: bold 2.9em Times New Roman; COLOR: #fff; PADDING-TOP: 30px
}
#header H1 A {
COLOR: #eee; TEXT-DECORATION: none
}
#header H1 A:hover {
COLOR: #ddd; TEXT-DECORATION: none
}
#header H2 {
PADDING-RIGHT: 25px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; FONT: 8pt tahoma; COLOR: #eee; PADDING-TOP: 0px; TEXT-ALIGN: right
}
#last {
CLEAR: both; PADDING-RIGHT: 5px; BORDER-TOP: #eee 1px solid; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px auto; COLOR: #eee; PADDING-TOP: 2px; HEIGHT: 20px; TEXT-ALIGN: right
}
#last A {
COLOR: #000; TEXT-DECORATION: none
}
#last A:hover {
COLOR: red; TEXT-DECORATION: none
}
#last UL {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; COLOR: #000080; PADDING-TOP: 0px
}
#last LI {
FLOAT: right; MARGIN: 0px 0px 0px 25px; LIST-STYLE-TYPE: none
}
#menu {
CLEAR: both; PADDING-RIGHT: 5px; BORDER-TOP: 1px solid #EEEEEE; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px auto; WIDTH: 700px; COLOR: #EEEEEE; PADDING-TOP: 2px; HEIGHT: 20px; TEXT-ALIGN: right; background-image:url('style_blue/sf_08.png')
}
#menu A {
COLOR: #000; TEXT-DECORATION: none
}
#menu A:hover {
COLOR: red; BACKGROUND-COLOR: #ffffff; TEXT-DECORATION: none
}
#menu UL {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; COLOR: #000080; PADDING-TOP: 0px
}
#menu LI {
FLOAT: right; MARGIN: 0px 0px 0px 25px; LIST-STYLE-TYPE: none
}
#sidebar {
CLEAR: both; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; FLOAT: right; PADDING-BOTTOM: 0px; MARGIN: 0px auto; WIDTH: 140px; PADDING-TOP: 0px
}
#sidebar H1 {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 20px 0px 10px; FONT: bold 1.4em Arial; COLOR: #000080; PADDING-TOP: 0px; BORDER-BOTTOM: #ddd 1px dotted; TEXT-ALIGN: right
}
#sidebar UL {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px 20px 0px 0px; PADDING-TOP: 0px; TEXT-ALIGN: right
}
#sidebar LI {
LIST-STYLE-TYPE: square
}
#main {
PADDING-RIGHT: 3px; PADDING-LEFT: 3px; FLOAT: left; PADDING-BOTTOM: 10px; WIDTH: 500px; PADDING-TOP: 3px; TEXT-ALIGN: right
}
#main H1 {
CLEAR: both; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 20px 0px 10px; FONT: bold 1.4em Arial; COLOR: #000080; PADDING-TOP: 0px; BORDER-BOTTOM: #ddd 1px dotted; TEXT-ALIGN: right
}
#main H1 A {
TEXT-DECORATION: none
}
 .title {
CLEAR: both; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 20px 0px 10px; FONT: Simplified Arabic; COLOR: #000080; font-size: 24px; PADDING-TOP: 0px;  TEXT-ALIGN: center
}

 .title2 {
CLEAR: both; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 10px 0px 10px; FONT: bold 1.4em Arial; COLOR: #dc143c; PADDING-TOP: 0px;  TEXT-ALIGN: center
}
#main H1 A:hover {
TEXT-DECORATION: none
}
#main IMG {
BORDER-RIGHT: #eee 1px solid; PADDING-RIGHT: 3px; BORDER-TOP: #eee 1px solid; PADDING-LEFT: 3px; FLOAT: right; PADDING-BOTTOM: 3px; MARGIN: 0px 0px 5px 8px; BORDER-LEFT: #eee 1px solid; PADDING-TOP: 3px; BORDER-BOTTOM: #eee 1px solid
}
#main A IMG {
BORDER-RIGHT: #000080 1px solid; BORDER-TOP: #000080 1px solid; BORDER-LEFT: #000080 1px solid; BORDER-BOTTOM: #000080 1px solid
}
#main A:hover IMG {
BORDER-RIGHT: #eee 1px solid; BORDER-TOP: #eee 1px solid; BORDER-LEFT: #eee 1px solid; BORDER-BOTTOM: #eee 1px solid
}
#main P {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 5px 0px; PADDING-TOP: 0px
}
#main A {
TEXT-DECORATION: underline
}
#main A:hover {
TEXT-DECORATION: none
}
#bottom {
CLEAR: both; HEIGHT: 20px
}
#bottom IMG {
PADDING-RIGHT: 0px; PADDING-LEFT: 5px; PADDING-BOTTOM: 0px; PADDING-TOP: 0px
}
#footer {
CLEAR: both; BACKGROUND-POSITION: left top; BACKGROUND-ATTACHMENT: scroll; BACKGROUND-IMAGE: url(images/footer.gif); COLOR: #eee; BACKGROUND-REPEAT: no-repeat; HEIGHT: 60px; TEXT-ALIGN: right
}
#footer #left {
DISPLAY: inline; FLOAT: left; MARGIN: 17px 0px 0px 25px
}
#footer #right {
DISPLAY: inline; FLOAT: right; MARGIN: 17px 25px 0px 0px
}
#footer A {
COLOR: #eee; TEXT-DECORATION: none
}
#footer A:hover {
COLOR: #ddd; TEXT-DECORATION: none
}
#search {
PADDING-RIGHT: 0px; PADDING-LEFT: 30px; FLOAT: left; PADDING-BOTTOM: 0px; MARGIN: 0px; WIDTH: 220px; PADDING-TOP: 40px; HEIGHT: 29px
}
#search INPUT {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; FLOAT: right; PADDING-BOTTOM: 0px; BORDER-TOP-STYLE: none; PADDING-TOP: 0px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BORDER-BOTTOM-STYLE: none
}
#search INPUT#s {
BORDER-RIGHT: #eee 1px solid; BORDER-TOP: #eee 1px solid; FONT: 8pt tahoma; MARGIN-LEFT: 4px; BORDER-LEFT: #eee 1px solid; WIDTH: 160px; COLOR: #eee; BORDER-BOTTOM: #eee 1px solid; HEIGHT: 15px; BACKGROUND-COLOR: #000080
}
#search INPUT#submit {
BORDER-RIGHT: #eee 1px solid; BORDER-TOP: #eee 1px solid; FONT: 8pt tahoma; BORDER-LEFT: #eee 1px solid; WIDTH: 50px; COLOR: #eee; BORDER-BOTTOM: #eee 1px solid; BACKGROUND-COLOR: #000080
}
FIELDSET {
BORDER-RIGHT: #ddd 1px solid; PADDING-RIGHT: 8px; BORDER-TOP: #ddd 1px solid; PADDING-LEFT: 8px; PADDING-BOTTOM: 20px; MARGIN: 10px 0px 8px; BORDER-LEFT: #ddd 1px solid; COLOR: #000080; PADDING-TOP: 20px; BORDER-BOTTOM: #ddd 1px solid
}
INPUT {
BORDER-RIGHT: #ddd 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #ddd 1px solid; PADDING-LEFT: 2px; PADDING-BOTTOM: 2px; FONT: 8pt tahoma; BORDER-LEFT: #ddd 1px solid; COLOR: #000080; PADDING-TOP: 2px; BORDER-BOTTOM: #ddd 1px solid
}
TEXTAREA {
BORDER-RIGHT: #ddd 1px solid; PADDING-RIGHT: 3px; BORDER-TOP: #ddd 1px solid; PADDING-LEFT: 3px; PADDING-BOTTOM: 3px; FONT: 8pt tahoma; BORDER-LEFT: #ddd 1px solid; WIDTH: 350px; COLOR: #000080; PADDING-TOP: 3px; BORDER-BOTTOM: #ddd 1px solid; HEIGHT: 200px
}
#comment {
CLEAR: both; PADDING-RIGHT: 0px; BORDER-TOP: #ddd 1px dotted; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 50px 0px; PADDING-TOP: 0px
}
#commentsbox {
margin-left:0px; margin-right:0px; margin-top:0px; margin-bottom:10px; background-color:#E8EEFF
}
#textcomment {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 10px; PADDING-TOP: 10px;
  background-color: #99CCFF
}
#infoline {
CLEAR: both; PADDING-RIGHT: 0px; BORDER-TOP: #ddd 1px dotted; PADDING-LEFT: 0px; PADDING-BOTTOM: 2px; MARGIN: 5px 0px; PADDING-TOP: 2px; TEXT-ALIGN: left; BACKGROUND-COLOR: #f5f5f5
}
#infoline #right {
FLOAT: right
}
#infoline #right A {
COLOR: #cc0000; BACKGROUND-COLOR: #F5F5F5; TEXT-DECORATION: none
}
#infoline #right A:hover {
COLOR: #c7db65; BACKGROUND-COLOR: #F5F5F5; TEXT-DECORATION: none
}
#paginator {
CLEAR: both; PADDING-RIGHT: 10px; PADDING-LEFT: 10px; PADDING-BOTTOM: 10px; MARGIN: 50px 0px 10px; PADDING-TOP: 10px
}
#strong {
COLOR: #cc0000
}

/* Paginator */
.paginator { font-size: 12px; padding-top: 10px; margin-left: auto; margin-right: auto; }
.paginator a, .this-page { color: #0063DC; padding: 2px 6px; border: solid 1px #ddd; background: #fff; text-decoration: none; }
.paginator a:visited { padding: 2px 6px; border: solid 1px #ddd; background: #fff; text-decoration: none; }
.paginator a:hover { color: #fff; background: #0063DC; border-color: #036; text-decoration: none; }

.paginator .atfirst { padding: 2px 6px; border: solid 1px #ddd; background: #fff; color: #aaa; }
.paginator .atprev { margin-right: 5px; padding: 2px 6px; border: solid 1px #ddd; background: #fff; color: #aaa; }
.paginator .atlast { padding: 2px 6px; border: solid 1px #ddd; background: #fff; color: #aaa; }
.paginator .atnext { margin-left: 5px; padding: 2px 6px; border: solid 1px #ddd; background: #fff; color: #aaa; }

.paginator .first { padding: 2px 6px; border: solid 2px #ddd; background: #fff; }
.paginator .prev { margin-right: 5px; padding: 2px 6px; border: solid 2px #ddd; background: #fff; }
.paginator .last { padding: 2px 6px; border: solid 2px #ddd; background: #fff; }
.paginator .next { margin-left: 5px; padding: 2px 6px; border: solid 2px #ddd; background: #fff; }

.paginator .break { padding: 2px 6px; border: none; background: #fff; text-decoration: none; }
.paginator .this-page { padding: 2px 6px; border-color: #999; font-weight: bold; font-size: 13px; vertical-align: top; background: #fff; color: #FF0084; }
Logged
Fifty years of programming language research, and we end up with C++?