Single Page Wordpress Template - wordpress

I have to convert the following HTML website into a Theme for Wordpress. I am trying to figure out how to structure the theme in terms of pages/posts/custom modules and themes.
I have 5 sections in my page
Home (Slider and content)
Know (tabs with content)
View (Projects with filterable effect)
Read (blog and articles)
Talk (contact Form)
I want to allow the customer to be able to edit most of the content on the page.
Please guide me into getting started.
Link: http://play.mink7.com/sophiance/
*Edit*
I created a page called 'home' and in settings>reading> selected that as the static content for the site.
Next i created a template called template-home.php and selected the home to use this template.

in your index.php file put the 5 sections.
in each section - create a new query to pull a page.
for example with a custom post type
<section id="home">
//Slider Content
<?php query_posts('pagename=home'); if ( have_posts() ) while ( have_posts() ) : the_post(); ?>//Loop Content
<?php endwhile; endif; wp_reset_query(); ?>
</section>
<section id="know">
<?php query_posts('pagename=know'); if ( have_posts() ) while ( have_posts() ) : the_post(); ?>//Loop Content
<?php endwhile; endif; wp_reset_query(); ?>
</section>
etc.
Then create each page with that name and it will pull the data
I created a site like that here

This is how you should structure your Wordpress website:
Home (Slider and content) - create a page called Home and a custom page template called home
Know (tabs with content) - use a shortcode plugin to have tabbed content, default page template
View (Projects with filterable effect) - use a plugin that displays content in a masonry layout, default page template
Read (blog and articles) - create posts (under posts) and display them using the post archive.
Talk (contact Form) - use default page template and a plugin like Gravity Themes for the contact form
For similar ideas on how to structure your Wordpress website go to http://www.mybuzzmedia.net

Related

Wordpress website with blog page structure

I've built a website (locally) that works just fine and, I've written the home page content in the Index page as I'm accustomed to and, different templates (page1.php, page2.php) for pages that required different layout for the 'About' and 'Contact' pages etc. Since deciding to add a blog though it has me stumped. I've written a blog page and it looks just fine but when I try to view a post I'm just directed back to index.php. I know it's down to the structure but it's confusing. An index page is mandatory, and you should probably have a front-page.php too. If that's the case..which one should I write my home page on? Index page doesn't show in the reading list and choosing "front page' as a static page works but still the blog links go back to index. If I was to put the content from the index page into front-page.php, what would I have in the index page?
Although the Wordpress docs are good I can't really find anything to suggest which way round all this stuff would be.
Your issue is that WordPress by default uses the index.php file for the blog archive (as well as other archives, etc.) and you need to use front-page.php for a dedicated home page with your custom content.
Read https://developer.wordpress.org/themes/basics/template-hierarchy/ on how to construct a standard WordPress theme with template files that follow a standard hierarchy.
The front-page.php template file is used to render your site’s front
page, whether the front page displays the blog posts index (mentioned
above) or a static page. The front page template takes precedence over
the blog posts index (home.php) template. If the front-page.php file
does not exist, WordPress will either use the home.php or page.php
files depending on the setup in Settings → Reading. If neither of
those files exist, it will use the index.php file.
Duplicate index.php and call it front-page.php. Edit index.php to be a basic template with a standard loop (and none of your home page content) so that it can function as a blog template that displays the_excerpt or the_content, something like this:
<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
<h2><?php the_title(); ?></h2>
<?php the_excerpt(); ?>
<?php endwhile; else: ?>
<?php _e( 'Sorry, no posts matched your criteria.', 'textdomain' ); ?>
<?php endif; ?>
See https://developer.wordpress.org/themes/basics/the-loop/

How to have a folder structure in a wordpress template (For ex : http://www.example.com/products/story)

I am new to wordpress and trying to get my head around it. I figured that I can create a custom php file as
<?php
/*
Template Name: The Story
*/
?>
<?php get_header() ?>
<?php get_sidebar(); ?>
<div class="story_content"><?php echo get_option('story-content') ?></div>
<?php get_footer() ?>
and in the admin panel , I can add a new page and choose "the story" as the template , which will in turn , give me an URL as http://www.example.com/thestory
But for the life of me , I can't figure out how to have a directory structure in the website such as http://www.example.com/products/thestory
Can someone help me out here.
Thanks already!
You can achieve this with "Pretty Permalinks" enabled in WordPress, by simply creating two pages:
A Products page with a slug of /products
A The Story page that is a child of Products (i.e. The Story has a parent post: Products). You'd make this slug /thestory (it will automatically be appended to the parent slug: /products)
This can all be done from within the Dashboard Pages area, without editing templates.

Wordpress: Implement basic HTML form functionality to retrieve data and visualize the results

I have experience in HMTL/PHP but I cannot understand how someone could implement this basic functionality in Wordpress. I could not find an article or web page on their website or by searching through the internet.
I want to create a basic html form, pass some data as select queries in a database and visualize back the results paginated.
In traditional PHP we are using "action" in order to send the form data through POST or GET to the action page and then with some PHP code we can fetch the data and visualize it with tables etc.
I cannot understand how to do such a thing in a wordpress page. Where the action parameter should point to? How could I implement this basic functionality in WordPress?
Please could someone help?
This is the mode to develop a separated .php file which uses your wordpress theme and can access to almost all wordpress functions:
<?php include(’wp-blog-header.php’); ?>
<?php get_header(); ?>
<!– Your code here –>
<?php get_sidebar(); ?>
<?php get_footer(); ?>
Then you can use all WordPress functions cited here: http://codex.wordpress.org/Function_Reference
You can save this file anywhere, but be sure to insert correct path to wp-blog-header and there must not be any prohibiting .htaccess
This is the way to insert php code into a wordpress post:
You have to use this plugin http://wordpress.org/plugins/allow-php-in-posts-and-pages/
Then create a post and use [php] [/php] to insert your php code and open it. Look at the address bar. This it the URL to access this post. Use it as action parameter in your form. Then control $_REQUEST[] in your php code to extract parameters received from your form.
Now you can control this post as any other normal wordpress post from the wordpress admin panel.
You need to create custom wordpress templates for pages in your theme. Here i use templates
1.form-page.php --- with template name "Form-page-template" and
2.form-page-action.php ---with template name "Form-page-action-template"
form-page.php
<?php
/*
Template Name: Form-page-template
*/
?>
<?php get_header(); ?>
<form method="post" action="http://yourdomain.com/form-page-action/" name="input-form"/>
<!-- form contents -->
</form>
<?php get_sidebar(); ?>
<?php get_footer(); ?>
You just save this template inside your theme : location => like wp-contents/themes/your-theme/form-page.php . and this will add Form-page-template in your theme .Now create a page inside from wordpress dashboard through pages->addnew ,here i give page name "form-page" and select template for page from right pannel,here we need to select "Form-page-template" that we created early.
Now we have the page url :: http://yourdomain.com/form-page/ where we can see our form,now create form-action-page.
2.form-page-action.php
<?php
/*
Template Name: Form-page-action-template
*/
?>
<?php get_header(); ?>
<!-- Your action page contents goes here -->
<?php
//getting input etc.. you need to do
$input = $post['input'];
?>
<?php get_sidebar(); ?>
<?php get_footer(); ?>
Now you need to save this template inside your theme as above, Create a new page for this template as said above here i creating a page "form-page-action" with template "Form-page-action-template" so here i get a page url for our
action page like :: http://yourdomain.com/form-page-action/ , and you need to use this url as the action url in your form page.and this way you can add your form action page inside wordpress theme.
You can edit the contents of these page inside from wordpress like=> Appreance -> Editor , select the templates to edit.

Wordpress - separate blog page not showing the posts but showing the homepage of the custom theme

Wordpress - separate blog page not showing the posts and showing the homepage of the custom theme... (not redirecting to home page just showing in place of blog page with the link http://www.example.com/blog on the addressbar of the browser)
As I have already adjust the setting on wp-admin following as
SETTING>Reading>
A static page
Front page to Home (homepage of the theme) and
posts to blog (separate blog page of the theme)
And Blog page consist the following code
<?php
/*
Template Name: Blog
*/
get_header();
if ( have_posts() ) :
// Start the Loop.
while ( have_posts() ) : the_post();
get_template_part( 'content', get_post_format() );
endwhile;
// Previous/next post navigation.
next_previous_paging_nav();
else :
// If no content, include the "No posts found" template.
get_template_part( 'content', 'none' );
endif;
get_footer(); ?>
And the Home page of the theme is almost static page.
Make sure your static home page template is not in a file called index.php or home.php. If WordPress detects any one of those files it will automatically assume it is the template for your posts. Therefore create a front-page.php or similar for your static home page and index.php or home.php for your posts page.

How to create a single post page in wordpress theme?

I am new to wordpress theme. I have created a wordpress theme by creating index.php and style.css. This theme is actually a blog theme. So, i have designed all the section in index.php and that is my front page and i have write the php code to display the blog post from the wordpress automaticaly. It works fine.
My question is, when i click on the title of the blog post it goes to the next page which indicates mysitenamedomain/post-id and i seems nothing on that page. whether i want to create a single.php page to display the title, content etc on that page?
In single.php you have to use loop
Here is documentation: Codex
Try: (in single.php):
<?php while ( have_posts() ) : the_post(); ?>
<h3><?php the_category(' › '); echo " › "; the_title(); ?></h3>
<?php the_content(); ?>
<?php endwhile; // end of the loop. ?>
Of course you have to style it.
login admin panel and create a new post here by clicking the "POST" menu of dashboard, put the post title and post content here and then save it . after that check single page on website it will display the title , content etc

Resources