I am trying to create a Wordpress site. The design is Here
I have created most of the outline of the site, barring the 3 regions "Follow Us", "Self Employment" & "Into Work Consortium".
The client has told me he would like to make those 3 regions editable.
My template contains an Index file, Header & Footer File as well as the obvious CSS files.
I am using the "Multi Edit Plugin" Multi Edit Plugin but that guide, does it so that you create a CustomPage. I guess I could do that but what I want is my index.php file to be added to the admin side of the site and then point the template there or similar.
As it's getting a little frustrating working with multiple WP plugins that just don't seem to do the job correctly.
There are many ways to go about this: one being what was mentioned by Pekka and the other using Custom Page templates.
The above mentioned methods are, in theory, quite similar with subtle differences in terms of execution and inclusion.
Perhaps to better answer your question, I will provide a very brief sample outline below on Custom Post Templates. You may probably need to do a little more digging at Wordpress' Codex if you choose to further enhance anything else:
Custom Post Template Method
Referring to the wireframe provided in your image link, I propose that you use category filters to filter the associated posts to the right columns. So first up, you will need to create 4 categories for the method that I'm suggesting, namely: WELCOME, FOLLOW, SELF-EMPLOYMENT and CONSORTIUM.
After doing so, your index.php should look something like this:
INDEX.PHP
<?php get_header();?>
<!--container-->
<div id="container">
<?php query_posts('category_name=welcome&showposts=1'); ?>
<?php while (have_posts()) : the_post(); ?>
<!--top-content-->
<div class="top-content">
<h2><?php the_title();?></h2>
<p><?php the_content();?></p>
</div>
<!--top-content-->
<?php endwhile;?>
<!--bottom-content-->
<div class="bottom-content">
<!--follow-->
<div class="follow">
<?php include(TEMPLATEPATH . '/follow.php');?>
</div>
<!--follow-->
<!--self-employment-->
<div class="self-employment">
<?php include(TEMPLATEPATH . '/self-employment.php');?>
</div>
<!--self-employment-->
<!--consortium-->
<div class="consortium">
<?php include(TEMPLATEPATH . '/consortium.php');?>
</div>
<!--consortium-->
</div>
<!--bottom-content-->
</div>
<!--container-->
<?php get_footer();?>
What is happening here is that I'm doing a post query for posts tagged to the category "WELCOME" and filter the posts into the top-content DIV. Note that my loop starts right before of the top-content DIV and ends immediately after it. This will means that the loop will only affect that particular DIV. I have also set the post limit to "1", thereby restricting the display of posts to just the latest post.
Following on from there, you will notice that in the bottom-content DIV, I have included 3 different files for each column. These 3 files will be your custom post templates that you will need to create and have a post query to filter in the right post. An example of the custom post template will look something like this below:
FOLLOW.PHP
<?php query_posts('category_name=follow&showposts=1'); ?>
<?php while (have_posts()) : the_post(); ?>
<h2><?php the_title();?></h2>
<?php the_post_thumbnail('bottom-content-thumb');?> <!--you will have to enable featured image thumbs in your functions.php file before you can do this-->
<span class="read-more">Continue Reading</span> <!--there are other ways to do the read more link, but I'm just giving an example now so yeah-->
<?php endwhile;?>
The rest of the custom post templates for the bottom 3 columns should look something like the above. If there is any variation of style and all, you will probably have to shift things around and play around with the CSS.
I want to stress that this is not the one and only way to do what you hope to achieve, but rather, that it is one of the many. What I've suggested is only an example that hopes to provide some insights on how you can utilize Custom Post templates for developing Wordpress based sites.
My advice at the end of the day is to delve deeper into Codex and find out more about Custom Post/Page templates because eventually, they will come in very handy if you choose to make custom Wordpress templates.
Hope my post had made things a little clearer for you =)
Related
I'm absolutely new to WordPress theming but I decided to learn on the job and I really want the site to go live within the next week or so. I've stuck to a simple index.php (no templates or template-parts). I'm able to receive the contents in the proper format which they were published (with inline images, line breaks, etc.) but the css styling is absent. What could I be doing wrong?
<article <?php post_class(); ?> id="post-<?php the_ID(); ?>">
<div class="entry-content">
<?php
$content = wpautop(get_the_content());
echo $content;
?>
</div>
</article>
I realize there is a difference between the singular view and the list view (the loop). The list view doesn't actually style the content by default. Could that be where my problem lies, and if so, what's the best way to get around this problem?
EDIT
Essentially, I want the singular view (singular.php) within the index.php. When you visit the site you're greeted by an entire article, not previews and listings. So I don't actually need the loop for now. I simply retrieve the post and display the contents on the index page.
That is literally the only thing keeping my site from going online right now. I just need that article to be styled as it's supposed to be. There are only two files in my theme: index.php and style.css. I've already tried the_content(), I've also tried apply_filters('the_content', get_the_content()), to no avail. wpautop(get_the_content()) was the closest thing to styled I could get. I am retrieving the post using the_post() for now, could that be the issue, and if so, which is the best way to retrieve a post?
I have tried retrieving the post in various ways and it's still unstyled, so I decided to inspect the elements in the browser and found that WordPress is indeed attaching a class to the elements but just where on earth is that class? I read somewhere about a css reset being the possible cause -- how does one bypass any css reset issues?
It turns out it was just a header issue. Solved by adding:
<head>
<?php do_action('wp_head'); ?>
</head>
I want to integrate specific text (text, links, images) making reference to specific sentences of my blog post.
Is it possible to do it with code or using a plugin ?
I send you a sketch :
This is the sketch
That is common need and often Aside in WordPress is talked for it. There are WP plugins like Aside Widget, Custom Sidebars for ordinary needs. But if you need too much custom stuff like my website's "About this Article" sidebar widget - https://thecustomizewindows.com/2016/09/limitations-of-openvz-virtualization-to-guest-cloud-server-vps/ then it is better to use
Otto's this plugin to use PHP in text widget - https://wordpress.org/plugins/php-code-widget/ and use PHP. In my case, rest is PHP code like this on sidebar (I can use shortcode too) :
<?php if(is_single()) : ?>
<h3>About This Article</h3>
<strong>Title:</strong> <?php echo get_the_title(); ?><br />
Published on: <?php the_time('Y-m-d') ?>
<br />
...
// rest of the code
<?php endif; ?>
Obviously you can call post image thumbnail with WordPress function.
As you need specific text, you may think about combining Pull Quote Plugin or Aside Widget to mark the specific like and echo it with PHP.
As other options -- you can use CSS3 to automatically select first line, first paragraph, second sentence. You can use Javascript to conditionally mark.
Best possible customisation I saw is on BMJ's sidebars. They use Drupal, not WordPress. BMJ has beautiful sidebar -- (as example) - http://www.bmj.com/content/355/bmj.i4924 Drupal has description of the work - https://www.drupal.org/node/1557636 Sadly I lack idea about Drupal. I tried a lot behind using WordPress for academic purpose.
I have been building my first theme on WordPress and have run into problem while adding content into different sections.
My HTML is somewhat like this,
<div id="maintext">
<-- Text -->
</div>
<div id="products">
<-- Text and Images -->
</div>
<div id="about_company">
<-- Text boxes -->
</div>
How do I make sure the content added via the WordPress editor falls under the respective divs ? For the "maintext" div I'll load the content from the page itself but how do I add content to the other 2 divs dynamically ?
I searched on a couple of forums and many suggested to add content using widgets, is there any way it can be done without using widgets ?
Any help will be gladly appreciated.
Unfortunately adding multiple editable fields in a single page is not particularly easy using WordPress by itself.
Many WP devs I know (myself included) rely on the Advanced Custom Fields Plugin for additional content fields.
The steps to make this happen:
1) Install the ACF the plug.
2) In the settings area for ACF create some new fields.
3) Assign the new fields to appear for a specific page or set of pages.
4) Update your page-template for the given page(s) so that the new fields are displayed.
For instance you might create a set of standard wysiwyg fields and then assign them to the 'overview' page. Let's call these fields: main_text, products_info and about_company. Once the fields have been created and assigned to a page, when you edit that page the additional fields will be available to edit.
For these new fields to be seen by visitors, they must be added to the page-template you use for your overview page. The code could be something like this:
<div id="maintext">
<!-- Text -->
<?php if(get_field('main_text')){ //if the field is not empty
echo '<p>' . get_field('main_text') . '</p>'; //display it
} ?>
</div>
<div id="products">
<!-- Text and Images -->
<?php if(get_field('products_info')){ //if the field is not empty
echo '<p>' . get_field('products_info') . '</p>'; //display it
} ?>
</div>
<div id="about_company">
<!-- Text boxes -->
<?php if(get_field('about_company')){ //if the field is not empty
echo '<p>' . get_field('about_company') . '</p>'; //display it
} ?>
</div>
There are lots of good examples here. If you are feeling really ambitious, rather than install the plugin you could even include ACF directly in your theme.
You've got three options I believe:
Create a widget area where you can then display the content in a text widget: http://codex.wordpress.org/Function_Reference/register_sidebar
Create a template where you then get the content of a different page: http://codex.wordpress.org/Page_Templates#File_Folders
Create a new meta box for all your pages: http://codex.wordpress.org/Function_Reference/add_meta_box
I believe that the thing you are looking for is option 2. The others are more full-site oriented, if you want the extra content to show up on every single page.
If you are writing the theme, maybe you would like to consider using a WordPress Framework so you don't have to start from scratch.
If that is not the case, think of the end user. How will they add sections to pages and posts? Will they have to move across places within the WordPress UI, or would they rather user short codes?
My recommendation is to build a plugin that render the section within the document content. Or widget content if that is the case.
I wrote a little piece of code to illustrate how you can accomplish such a thing, and also because I kind of need it right now :D. You can find it on github here https://github.com/lionpage/Front-Office-Document-Sections
Hope this helps
<div id="maintext">
<?php the_content(); ?>
</div>
<div id="products">
<?php // echo wp function to get product data; ?>
</div>
<div id="about_company">
<?php // echo wp function to get about companydata; ?>
</div>
I've run into this issue several times now, and while the question is 3 years old, I think it's still rather current. I've succesfully used the Multiple Content Blocks plugin sometimes now:
https://ltz.wordpress.org/plugins/multiple-content-blocks/
After installing the plugin, you can just include the_block in your template:
<div id="maintext">
<?php the_content(); ?>
</div>
<div id="products">
<?php the_block('products') ?>
</div>
<div id="about_company">
<?php the_block('company') ?>
</div>
hi im currently developing a theme with that set up.
there are two ways to achieve this:
widgetized and fixed admin panel (customizer options)
i am using the two in my themes
if widgets
create a .php file that includes the widgets sections
create a widget for that section
if fixed in admin panel
you have to include the .php section in your functions.php
edit * advantage of widgetized is you can arrange them just like in a regular sidebar
Was struggling with this, and did not want to use a plugin. The only WordPress native option I found was to use Custom Fields. This works, but only for text, and is rather cumbersome.
The other non-plugin option is to simply use HTML in the WordPress editor, but this is of course far from ideal either.
Finally I gave up, and opted for the Advanced Custom Fields plugin as well.
I want to create a page template that has a pre-fixed css. Lets say I name it page-sevencol.php then I know that the content will have a fixed width and a specific style and so on. My pages have different layouts thats why I need to create these kind of templates.
Is it possible? if so how? Ive looked in the wp codex and it does not seem to have the answer. Please take a minute to help me.
Thank you!
you seem to need just a limited set of templates. The question is: do you want to apply them automatically? Basically, there are two techniques to apply a template to a page (or post or custom post, etc.) in WordPress.
First method: using the template naming convention to get the template automatically applied to a page (or post) with the same name.
In this case, you create a page page-mynewpage.php and this template will automatically get applied to your page named /mynewpage/.
Second method: you create a template by creating a page (let's say : template1.php) and declaring it as a template with a comment at the top of the page:
/**
* Template Name: Template1
*
*/
This template will now be selectable inside the admin of WordPress to be applied to any page:
So if A) you only need a limited set of templates & B) are ok to select them on a per-page basis in the admin, this is your solution. You would just need to create as many pages as you need templates, not forgetting to include the comments that declare them as templates and using a different name each time.
If you need your templates to be applied dynamically, then we need more info about the logic to use for select each template...
EDIT : That is it, Abel (just read your comment). Your page is mainly generated with 4 elements: header.php, sidebar.php, footer.php and another page to produce the content, but this page is different depending on where you are in the site. If you are on a page, it will be, by default, page.php. If you are reading a post, WordPress will by default use single.php.
To apply all your different templates, just go and open page.php in your theme folder. Save it under another name, like page-template7cols.php. Insert a comment like I just explained above, so this template will show in your admin next time you create a new page. Adapt it the way you want (changing the HTML / PHP and therefore adapting the way the content of the page will be displayed). Do the same for your other 9 templates.
Then, everytime you create a new page, just start by selecting the proper template in your dropdown (see previous screen capture). And whenever you will make a change to page-template7cols.php, for example, the changes will be reflected on all pages for which you have selected this template.
/**
Template Name: Template1
*/
<?php get_header(); ?>
<div class="content-wrap sevencol clearfix">
<div class="row clearfix">
<div class="content">
<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
<h1><?php the_title(); ?></h1>
<?php the_content(); ?>
<?php endwhile; endif; ?>
</div>
<?php get_sidebar(); ?>
<?php get_footer(); ?>
Good Evening,
I'm using Drupal 6, CCK Module, and the Link Field Type. All are installed and activated.
I created a custom content type called Slider. A user can upload an image, a title, and a teaser. I created a custom field for that slider content type as well as one called Link with the field name: "field_link_test".
I created an entry, filled in all of the data including a URL for that link field type and clicked "Save". In views-view-table--slider.tpl.php, I added:
Learn More
but on the front end, everything shows except for that link. I also tried emptying the Drupal cache.
Any ideas?
Update template code below, which all works fine, except for the new link value outputs nothing.
<div id="slider">
<div class="slider-holder">
<?php foreach($rows as $row): ?>
<div class="slide">
<?php print $row['field_image_fid'] ?>
<div class="info-slide">
<h2><?php print $row['title'] ?></h2>
<p><?php print strip_tags($row['teaser']) ?></p>
Learn More
</div><!--INFO-SLIDE-->
</div><!--SLIDE-->
<?php endforeach ?>
</div><!--SLIDER-HOLDER-->
<div id="control">
</div>
</div><!--SLIDER-->
The easy possibilities (which you've probably checked, but just to get them out of the way):
you need to allow the field to be viewable by anonymous/authenticated users in User Management - Permissions
Otherwise, it's hard to tell without some code to analyse. Could you post your entire views-view-table--slide.tpl.php and if possible, your exported view or a link to the exported view?
EDIT
Now that I've had a chance to look at your view, I've made a couple of changes that should help.
The reason your link URL isn't showing is that you're including the "Node: Link" field in your View instead of the "Content: Link (field_link_test)" field. The first one will just link back to the original node rather than your custom link. Also, I don't think you can call the $node variable from views-view-table (at least, I don't get anything when I print it. Instead, you can use the $row variable.
I have a version of your template that prints out the URL in the field "link_test" with the label "Learn More." I put the "Learn More" text in the View itself as that'll be easier to edit and works better with the Link CCK type (which by default will want to add a title you add in the node edit screen).
The view export is here: http://pastebin.me/0ed2942f6953cb00cab1bd5386058a13. You can import this back into your site, but you may want to clone your original View first to make a backup, so that if this isn't what you want, you can use your old version.
The updated tpl is:
<div id="slider">
<div class="slider-holder">
<?php foreach($rows as $row): ?>
<div class="slide">
<?php print $row['field_image_fid'] ?>
<div class="info-slide">
<h2><?php print $row['title'] ?></h2>
<p><?php print strip_tags($row['teaser']) ?></p>
<?php print $row['field_link_test_url'] ?>
<?php //print_r($row); ?>
</div><!--INFO-SLIDE-->
</div><!--SLIDE-->
<?php endforeach ?>
</div><!--SLIDER-HOLDER-->
<div id="control">
</div>
</div><!--SLIDER-->
Let me know if you have any issues/questions.
Are you sure the template is getting picked up (add <p>heavymark</p> above the href... does it show up?)?
If above shows up, add a var_dump($node) above the anchor tag and post the output so we can get a better idea of what's there (you probably want to enable XDebug so you get better formatted output, if its not on already).
Make sure you add the link field to the view in the fields section. This should allow it to be themeable from within your template file. If you are still not seeing it, try using
print_r($rows,1);
or some variable of print_r to view all the rows that are available to be themed.