Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home › Forums › Back End › HTML to WP (2pages) Blog Only

  • This topic is empty.
Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • April 21, 2014 at 1:36 am #168350
    MSiegle
    Participant

    Hey all-

    I have a current client that would like the blog aspect of her site on WP so she can update the blog. The rest of her site in on a one page, index.html.

    I have scoured the net and have not come-up with a solution. I am wondering if anyone know’s a solid place for me to learn how to do this?

    Regards,
    Mike

    April 21, 2014 at 12:25 pm #168390
    Alen
    Participant

    Create a folder in the root of your site, name it blog. Install WordPress into this folder. Once everything is configured, visit: example.com/blog you will see your default WP install.

    To access the WP Admin panel go to: /blog/wp-admin.

    In the: blog/wp-content/themes/ folder create a folder for your theme files. And have fun! :)

    Since the question/problem is little vague, please provide as much information as possible so we can better help you.

    And don’t forget to back-up/take notes!!
    -Alen

    April 21, 2014 at 2:49 pm #168393
    MSiegle
    Participant

    Alen-

    Thank you for your reply.

    Fortunately, I am familiar with WP, just not PHP. Actually found a good piece of video Your text to link here… at css-tricks.com. Thank you again, I am also going to check out the links you provided.

    So basically there are 2 files, blog.html (1st blog page) and single-blog-post-1.html (post’s page). The client would like to keep the style that matches her site which will remain in static html. She would like to run the blog from WP only. She will be updating the blog on her own so WP is essential.

    I have all the files needed on the html/css side, just need help making the blog portion dynamic.

    All the best,

    Mike

    April 21, 2014 at 3:37 pm #168395
    Alen
    Participant

    All you need to do is create 3 files in your theme folder.

    • style.css this file tells WordPress core that there is a theme present, there is some essential code that you must include with this file. (see bellow)
    • index.php this file is the base file from which WordPress operates. So in essence blog can function with just this one file.
    • single.phpthis file is responsible for displaying a singular view of blog post. It’s essentially same as index.php with few changes.

    Now what most people do is split the header and footer pieces, so that it’s easier to maintain. For example, if you add a link to a JavaScript file you would have to edit both index.php and single.php. (see notes in code)

    The style.css file must contain following at the top of the file:

    
/*
Theme Name: Simple Blog Theme
Theme URI: http://#
Author: the author
Author URI: http://#
Description: description
Version: 1.0
*/

/* styles here */

    And here’s your index.php

    <!-- THIS WOULD BE header.php -->
<!-- and you would include it in the each file you create as < ?php get_header(); ?> -->
<!doctype html>
<html>
<head>
    <meta charset="<?php bloginfo('charset'); ?>">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title><?php bloginfo('name'); ?><?php wp_title(); ?></title>
    <meta name="title" content="<?php wp_title( '|', true, 'right' ); ?>">
    <meta name="description" content="<?php bloginfo('description'); ?>" />
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="<?php echo get_template_directory_uri(); ?>/style.css" />
    <link rel="profile" href="http://gmpg.org/xfn/11" />
    <link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />
    <link rel="alternate" type="application/rss+xml" title="RSS" href="<?php bloginfo('rss2_url'); ?>" />
    <?php wp_head(); ?>
</head>
<!-- THIS WOULD BE END OF header.php -->
    <!-- index.php -->
    <body <?php body_class(); ?>>
    <!-- WORDPRESS LOOP -->
        <?php if (have_posts()) : while (have_posts()) : the_post(); ?>
            <article <?php post_class() ?> id="post-<?php the_ID(); ?>">
                <h2><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></h2>
                <div class="entry">
                    <?php the_content(); ?>
                </div>
                <footer class="postmetadata">
                    <?php the_tags(__('Tags: '), ', ', '<br />'); ?>
                    <?php _e('Posted in'); ?> <?php the_category(', ') ?>
                </footer>
            </article>
        <?php endwhile; ?>
        <?php else : ?>
            <h2><?php _e('Nothing Found'); ?></h2>
        <?php endif; ?>
    <!-- END WORDPRESS LOOP -->
    <!-- end index.php -->
<!-- THIS WOULD BE footer.php -->
<!-- and you would include it in the each file you create as < ?php get_footer(); ?> -->
<!-- WP-FOOT-->
<?php wp_footer(); ?>
<!-- END WP-FOOT -->
</body>
</html>
<!-- THIS WOULD BE END OF footer.php -->

    The single view, just copy index.php and name it single.php and make any changes you need.

    This should be enough to get you started, let me know if you have any questions,

    -Alen

    April 21, 2014 at 3:52 pm #168396
    Alen
    Participant

    All you need to do is create 3 files in your theme folder.

    • style.css this file tells WordPress core that there is a theme present, there is some essential code that you must include with this file. (see bellow)
    • index.php this file is the base file from which WordPress operates. So in essence blog can function with just this one file.
    • single.phpthis file is responsible for displaying a singular view of blog post. It’s essentially same as index.php with few changes.

    Now what most people do is split the header and footer pieces, so that it’s easier to maintain. For example, if you add a link to a JavaScript file you would have to edit both index.php and single.php. (see notes in code).

    See this for code: https://gist.github.com/alenabdula/11159171

    April 21, 2014 at 4:15 pm #168397
    MSiegle
    Participant

    Alan-

    You are super helpful. Would it be possible to Skype you? My skype is msiegle13

    I am just a lil confused as to where the html and php are to mix together. It probably so simple, I’m just not understanding it. Maybe you would be so kind to walk me through it quickly. Also I need to know how to integrate the WP blog (once it’s set up) with the static site.

    The github link is helpful and awesome, thank you. PHP is something I have to learn, it’s a must.

    Regards,

    Mike

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)
  • The forum ‘Back End’ is closed to new topics and replies.