I am building a website for a friend who wants to use WordPress for a blog section. I could have just made the whole site as a custom WordPress theme, but I don't like using WordPress because it's bloated, slow, and buggy. So instead I want to add a recent posts module to the site by including the wp-load.php file from the WordPress site and using their functions.
I have made several attempts at creating the module and each method has resulted in an error.
Using a while (have_posts()) loop resulted in a 500 Internal Server Error so I tried using wp_get_recent_posts(array followed by a foreach statement, which doesn't result in the error but instead gets me an "End of file seen and there were open elements."
Here is the link to the site: http://colinthompson.ca/drake/
Here is the code for that section:
<section id="blog">
<h3>recent posts</h3>
<div id="post-wrap">
<?php
$recent_posts = wp_get_recent_posts(array(
'numberposts' => 3
));
foreach ($recent_posts as $post) {
echo '<div class="blog-post">
<div class="post-img">'.get_the_thumbnail($post['ID']).'</div>
<h5>'.$post['post_title'].'</h5>
<p>by <span>'.the_author($post['ID']).'</span></p>
<p>'.the_date(d,m,y).'</p>
<p>'.the_excerpt($post['ID']).'</p>
</div>';
}
?>
</div>
<a id="full-blog" href="#" title="Check out the full blog"><div class="slide-in"><p>full blog</p></div><div class="arrow-shaft"></div><div class="arrow-head"></div><p>read more</p></a>
<a class="next-section" href="#contact" title="Let's get in touch"><div class="slide-in"></div><div class="arrow-shaft"></div><div class="arrow-head"></div></a>
</section>
I tried removing the foreach statement to test for unclosed elements in the html that is being echoed, but the error persisted, resulting in the unclosing of the parent div#post-wrap and grandparent section#blog and general fudging of the rest of the document.
When I removed the wp_get_recent_posts array the page loaded as normal, but without the posts of course.
Maybe I did simply forget to escape something but I don't see it. Any help is appreciated.
Thanks!
Where are you going to display the posts? Where is your friend going to write them?
It seems to me you are much better off including WordPress in it's entirety on just one part of the site.
Related
I want to have a masonry that I want to have 2 columns, and 2 blocks below each other on the left and 4 on the right as per the image below. I managed to get very close when I used the Jquery Masonry plugin - inside the grid HTML, but number 6 kept going below number 3. And I tried just HTML, Bootstrap containers, the works. The problem starts with the fact that I am using Wordpress and want to display the content by retrieving them from a foreach() loop.
Here is the PHP code (I removed the multiple HTML attempts):
<?php foreach($homestory as $home) : ?>
<? $story = get_post($home->ID); ?>
<div class="block">
<img src="an_image_pathe_here">
<?php echo $story->post_title; ?>
</div>
<?php endforeach ?>
You should forget to use a foreach to make this kind of display.
You should use this kind of syntax to fill your view
$homestory[0]->ID;
With a bootstrap column system or a css flex layout.
https://css-tricks.com/snippets/css/a-guide-to-flexbox/
I've got a wordpress page with tabs on it, and I want to show in one of 'em a query of posts from a category.
I've got an active li like: where the tab info is shown
<li class="tab-pane active" id="ert_pane1-4">
All I came up with is:
<?php
$tab-id= getElementById("ert_pane1-4");
echo $tab-id;
if($tab-id =='<li class="active">'){
query_posts('cat=1');
} endif;
?>)
I know this will sound rather easy but I'm a newbie on php but up to learn.
There are some problems. First, endif; is not needed:
if($tab-id =='<li class="active">'){
query_posts('cat=1');
}
Also, getElementById is JavaScript not PHP. This wouldn't work anyway since the page hasn't loaded yet while PHP is running.
Just started learning WordPress, and I've run into a problem I can't figure out. I'm trying to use WP for the News section of my website. So I want to keep all my styles and structure, but add WP comments, archives, etc. The problem is that WP appears to be interpreting the DOM differently on the Archives page than on the homepage.
Here's what I intend the basic HTML structure to be with the WP elements added in:
<div id="wp-main">
<div class="news">
<div class="posts">
<p>POST CONTENT</p>
<div id="wp-comments>
<span>WP COMMENTS CONTENT</span>
</div><!-- #wp-comments -->
</div><!-- .posts -->
</div><!-- .news -->
</div><!-- #wp-main -->
.news has its opening tag in header.php, and closing tag before the footer in footer.php. .posts has its opening tag in content.php, and its closing tag after the comments in comments.php. This works great for the homepage:
But the archive page is producing nested .posts within the parent .posts, resulting in a russian-doll effect:
I know it's hard to pin-point a problem when you don't have access to all the code, but as you know, there's LOTS of it, so hopefully there is a wordpress expert out there, and I'm just making an obvious mistake :)
I figured it out, and I don't think anyone could've made this leap without much more information. In order to show the comments on the homepage I added this code to index.php (in the while loop):
$withcomments = "1";
comments_template();
Since my .posts ends AFTER the comments, I had to add that code to the while loop of archive.php as well. I didn't have the closing tag, since the comments weren't there.
I'm working with Drupal for the first time, and have been able to find answers for all of my other questions, so far, on either Drupal's forms or via other means. However, I can't seem to find a way to remove the "Main Menu" header from my superfish menu.
I've created a region called superfish and added superfish to it successfully. But above the menu there is an Main Menu that I would like to remove. There doesn't seem to be a way to do this from the superfish options, and i can't seem to find where in the code this is being appended, or else I would just comment out that line. I've searched in the superfish.js file as well as the 'superfish.module` file and can't seem to find it. I'm a programmer first and a 'web designer' second, so getting my hands dirty in some code is not a problem, in fact, I would prefer to do it that way.
Has anyone else done this? Or know where I should start to look?
This is the html that is generated at runtime:
<div id="superfish">
<div class="region region-superfish">
<div id="block-superfish-1" class="block block-superfish contextual-links-region">
<h2>Main menu</h2>
<div class="contextual-links-wrapper contextual-links-processed">
<div class="content">
<ul id="superfish-1" class="menu sf-menu sf-main-menu sf-horizontal sf-style-simple sf-total-items-2 sf-parent-items-1 sf-single-items-1 superfish-processed sf-js-enabled sf-shadow">
<li id="menu-221-1" class="active-trail first odd sf-item-1 sf-depth-1 sf-no-children">
<li id="menu-312-1" class="active-trail last even sf-item-2 sf-depth-1 sf-total-children-1 sf-parent-children-0 sf-single-children-1 menuparent">
</ul>
</div>
</div>
</div>
Thanks!
I stumbled across the real answer... Isn't it funny that one tends to figure things out when they stop thinking about them?
The main menu header was the block title, when editing the superfish block the very first field is Block Title this allows one to override the default setting of the block title. By placing <none> in this field, the block title is no longer displayed.
Apart from finding where that HTML is output, which is the ideal solution, you could use jquery after the fact to remove the title.
$('#superfish h2').html('');
jsfiddle here: http://jsfiddle.net/DetEb/
In my wordpress site, I have a page that has 3 sections. Every section contains posts from a specific category. I use this wordpress query to get the latest 3 posts in that category and load it in it's section(div). So, for "Novels" section, I use this query:
<? $novels = get_option('of_novels') ?>
<?php $paged = (get_query_var('paged')) ? get_query_var('paged') : 1; query_posts('category_name=$novels&posts_per_page=3'); ?>
<?php while (have_posts()) : the_post(); ?>
<div class="sliderunit">
<?php the_post_thumbnail(); ?>
<div class="novelsslidertitle">
<div class="arrow-left"></div>
<img class="cross" src="<?php bloginfo('stylesheet_directory'); ?>/images/cross.png"/>
<?php the_title(); ?>
<h3>رواية</h3>
</div>
</div>
<?php endwhile;?>
and that gets me the latest 3 posts in #novels category. Now, I have some buttons. I want to write some jequery to loop on this category and get previous and next posts, and reloads the new queries content to that #novels div, replacing the old query code in the html using
$("<div/>").replaceWith("// Replace with a function to get the code of new output");
to act as a slider without using pagination and reloading the page? I hope my problem is well declared, I appreciate any helpful clues, links or references.
I don't think $.replaceWith is really what you need here. You would just listen for when the user reaches a certain point, maybe the last in the currently loaded posts, or the second to last, then run $.ajax() or similar query, append that to your #sliderunit and it will make it so you be able to continue scrolling/sliding. By appending and not replacing, you can go back and forth if you want without having to reload anything. If you are concerned about memory management, you could use $.remove() at a certain threshold.
In case you need a little more info on how to do this, start by appending your new data, then using CSS manipulation such as $.animate() to perform the slide effect. You can either use layers to hide things you don't want showing, or I guess you could also call $.hide() on blocks you don't want shown.