Problem In Werdpress


Hello Every One
This Is The First Time To Write Here In Graphic Design Forum
I Have Problem In My Wordpress Design in The Index Page
Like You See In The Photo The Posts Are Very Near I Give Them Margin top And Margin bottom 10px But For Sorry It Failed The Browser Show Me Them Like One Post
And Thank You Very Much To Read My Problem
 

Attachments

Paul Murray

Moderator
Staff member
10px isn't a lot. Try something bigger like 100px to check if it's working. If it is, reduce the number. If not, try and find out why it's not working.
 

Paul Murray

Moderator
Staff member
That code doesn't really tell me anything useful. The styling is controlled by the CSS file so I'd need to see what you're putting in there.
 

wac

Senior Member
I've had a cursory look. It appears that your content isn't wrapped in a specific DIV and that there isn't a specific class for a DIV in the CSS.

You need to do something like this:

PHP:
<?php get_header(); ?>
<div clas="stuff">
        <?php while (have_posts()) : the_post(); ?>
            <p class="sub-title"> <a href="<?php the_permalink(); ?>"> <?php the_title(); ?></a> </p>
    <figcaption> Writen By:<?php the_author_posts_link(); ?>      The Date:<?php the_time(); ?></figcaption>
        <a href="<?php the_permalink(); ?>">
        <?php the_post_thumbnail('thumbnail'); ?>
        </a>
                <content>
                    <article>
                        <?php the_content('...Read The Full Article'); ?>
                    </article>
                </content>
<?php endwhile; ?>
        </section>
</div>
            <?php get_sidebar(); ?>
            
                <?php get_footer(); ?>
Notice the new div "Stuff"

Then add something like this to your CSS

Code:
.stuff{ margin: 100px;}
If you need further help, I suggest you put the site up online somewhere as it will make it much easier to work with.
 
I've had a cursory look. It appears that your content isn't wrapped in a specific DIV and that there isn't a specific class for a DIV in the CSS.

You need to do something like this:

PHP:
<?php get_header(); ?>
<div clas="stuff">
        <?php while (have_posts()) : the_post(); ?>
            <p class="sub-title"> <a href="<?php the_permalink(); ?>"> <?php the_title(); ?></a> </p>
    <figcaption> Writen By:<?php the_author_posts_link(); ?>      The Date:<?php the_time(); ?></figcaption>
        <a href="<?php the_permalink(); ?>">
        <?php the_post_thumbnail('thumbnail'); ?>
        </a>
                <content>
                    <article>
                        <?php the_content('...Read The Full Article'); ?>
                    </article>
                </content>
<?php endwhile; ?>
        </section>
</div>
            <?php get_sidebar(); ?>
           
                <?php get_footer(); ?>
Notice the new div "Stuff"

Then add something like this to your CSS

Code:
.stuff{ margin: 100px;}
If you need further help, I suggest you put the site up online somewhere as it will make it much easier to work with.
For Sorry It Dosen't Work May You Edit It By Your Self Sir ?? This Is The Link https://www.mediafire.com/folder/6jn395qsiolaz/The_New
I Work On The Local Host Because I Dosen't Buy Domain And Hosting Jet !
Thank You For Your Help
 

wac

Senior Member
ok.

Add the following code to the .sub-h class in your CSS

padding: 20px;

Obviously, change 20px to whatever you want and remove the other padding rules from that class.

This will break the location of your sidebar which you've defined as a %, so you'll need to add something like this too:

width: calc(100% - 40px);

40px is based on the assumption that you've got 20px of padding on both the left and right, so if you change the padding you'll also need to change the calc.

The whole thing:
Code:
 .sub-h {
     float: left ;
     margin-right: 10px ;
     background-color: #fff ;
     border-radius: 15px ;
     -webkit-border-radius: 15px ;
     -moz-border-radius: 15px ;
     margin-bottom: 10px ;
     margin-top: 10px ;
    width: calc(72% - 40px);
     padding: 20px;}
You're biting off quite a lot by designing a WordPress theme at this stage. I'm not saying don't do it, but you would be making things a lot easier for yourself if you designed the site in plain old html+css first. That would allow you to iron out any kinks and also make it much easier for people to help you if/when required. You can then convert it to WP.
 
ok.

Add the following code to the .sub-h class in your CSS

padding: 20px;

Obviously, change 20px to whatever you want and remove the other padding rules from that class.

This will break the location of your sidebar which you've defined as a %, so you'll need to add something like this too:

width: calc(100% - 40px);

40px is based on the assumption that you've got 20px of padding on both the left and right, so if you change the padding you'll also need to change the calc.

The whole thing:
Code:
 .sub-h {
     float: left ;
     margin-right: 10px ;
     background-color: #fff ;
     border-radius: 15px ;
     -webkit-border-radius: 15px ;
     -moz-border-radius: 15px ;
     margin-bottom: 10px ;
     margin-top: 10px ;
    width: calc(72% - 40px);
     padding: 20px;}
You're biting off quite a lot by designing a WordPress theme at this stage. I'm not saying don't do it, but you would be making things a lot easier for yourself if you designed the site in plain old html+css first. That would allow you to iron out any kinks and also make it much easier for people to help you if/when required. You can then convert it to WP.
In The First I Had Learned Html And The Css And The Posts In The Static Web Site With The Same Codes Work Very Good
But When I convert This To WP It Dosen't Work ??
And The Code Which You Give It For Me It Else Dosen't Work
I Think I Can Do It Without Back-groundcolor I Try It And It Works Good
It Is Very Strange Problem More Than 4 Persons Try To Make It And It Dosen't Work
Thank You For Helping Me And See You Later In Another Good Chance And It Was Nice To Know To Good Bye
 
I Had Make This Well Done !!!!
The Problem Is I Should Make Div And Give Him Class Name And This Div Will Be In The <?php while (have_posts()) : the_post(); ?>
Like This Code
PHP:
<?php get_header(); ?>
    <?php while (have_posts()) : the_post(); ?>
            <div class="sub-h">
        <footer> <a href="<?php the_permalink(); ?>"> <?php the_title(); ?></a> </footer>
            <figcaption> Writen By:<?php the_author_posts_link(); ?>      The Date:<?php the_time(); ?></figcaption>
                <a href="<?php the_permalink(); ?>">
                    <?php the_post_thumbnail('thumbnail'); ?>
                        </a>
                            <content>
                                <article>
                                    <?php the_content('...Read The Full Article'); ?>
                                </article>
                            </content>
                        <hr>
                        </div>
                    <?php endwhile; ?>
                </section>
            <?php get_sidebar(); ?>
        <?php get_footer(); ?>
And Of Course Save The Section Tag In The Header.php But Without Class
 
Top