How to create a simple news system for PW

[Soma]

The echo should be in "..." not '...'

[Joss]

If articles is your news listing page and a child of your home, why don't you just do:

echo "<p>Return to: <a href='/articles/'>articles.</a></p>";

(Note: As Soma mentioned, whatch your use of quotes)

It is shorter, no less customizable and uses the page tree structure.

The API way of getting a url of a page is great for instance within a foreach loop where you are listing out the results from a query, but is not needed for a straight link. The API allows you to do things that are not straightforward; it is not intended as a replacement for ordinary actions.

[PhotoWebMax]

Thanks,

This is still a local site so in the end I used the obvious full path:

echo "<p>Return to: <a href='http://localhost:8888/siteName/articles/'>Articles</a></p>";

Using this would lead you to page not found message:

echo "<p>Return to: <a href='/articles/'>Articles.</a></p>";

Even though your tutorial was a PW API demonstration it works great for aggregating posts. The Blog Module is awesome but sort of overkill in some situations. I am glad to put the MODx getResources gymnastics behind me. MODx does have a very simple placeholder system for linking internal pages though...

[adrian]

You could use this:

echo "<p>Return to: <a href='{$config->urls->root}articles/'>Articles.</a></p>";

Then if your site ends up at the root of the domain when it's made live, you won't have to change links.

[Joss]

Well, so does ProcessWire - it is the page tree.

When developing locally, it is worth always installing as root, which means you either need to use the localhost root, or set up virtual hosts.

I am guessing you are using MAMP by the 8888 - if so, I found this guide:

http://sawmac.com/mamp/virtual/

[PhotoWebMax]

cool, thanks... Gotta run, plane to catch...

[csmith]

I've been using this system for my company's blog for some time now, but recently I've noticed an issue with the pagination. There appears to be a list item with nothing in it that's producing an ellipses at the end of the pagination bar at the bottom of the page:

You can see it live here: http://answerhub.com/blog

Any idea why this might be happening?

[Joss]

Hi, you appear to have an additional <li> without any content - can you post your code for the pagination and the markup immediately around it?

[csmith]

Hi Joss,

Thanks for looking into this. Here's the HTML for the pagination:

<div class="pagination">
	<ul>
		<li><a href="/blog/"><span>1</span></a></li>
		<li><a class="primary-color" href="/blog/page2">2</a></li
		><li><a class="primary-color" href="/blog/page3">3</a></li>
		<li><a class="primary-color" href="/blog/page4">4</a></li>
		<li><a class="primary-color" href="/blog/page5">5</a></li>
		<li><a class="primary-color" href="/blog/page6">6</a></li>
		<li><a class="primary-color" href="/blog/page7">7</a></li>
		<li><a class="primary-color" href="/blog/page8">8</a></li>
		<li><a class="primary-color" href="/blog/page9">9</a></li>
		<li><a class="primary-color" href="/blog/page10">10</a></li>
		<li>…</li>
		<li><a class="primary-color" href="/blog/page11">11</a></li>
		<li><a class="primary-color" href="/blog/page2">Next</a></li>
	</ul>
</div>

and here's the php from my functions.inc file:

$out .="<div class='pagination'>";
	$out .= $blogposts->renderPager(array(

	    'nextItemLabel' => "Next",
	    'previousItemLabel' => "Prev",
	    'listMarkup' => "<ul>{out}</ul>",
	    'itemMarkup' => "<li>{out}</li>",
	    'linkMarkup' => "<a class='primary-color' href='{url}'>{out}</a>"   

		));
	$out .="</div>";

	echo $out;

Not sure what would be causing that extra <li> without any content.

[Joss]

Very odd

I have just checked my music site which uses bootstrap and exactly that markup and it is fine.

The empty <li>, which seems to be the problem, is always 3rd from last in the list, except on the last page when it is third from the front.

I cannot work out why this is being generated or by what. What is your find() query for the news list? Or, even the entire function?

[csmith]

Here's the entire function:

function blogList(){

	// Grab the page name from the url

	$thisCategory = wire("page")->name;

	// If the category is not called "blog" then output the category name as a selector for the find.

	if($thisCategory !="blog") {
		$category = "Category.name=" . $thisCategory;
	}	

	// Get the blog posts - limited to five for later pagination

	$blogposts = wire("pages")->find("parent=/article/, $category, limit=5, sort=-created");
				rsort($blogposts);

	$out =" ";

	//Loop through the pages

	foreach($blogposts as $blogpost){
		$out .="<div class='posts sidemeta'>";
			$out .="<div class='post'>";
				$out .="<div class='date-wrapper'>";
					$out .="<div class='date'>";
						$out .="<span class='month'>{$blogpost->published_date}</span>";
					$out .="</div><!-- /.date -->";
				$out .="</div><!-- /.date-wrapper -->";
				$out .="<div class='post-content'>";
					$out .="<h2 class='post-title'>";
						$out .="<a href='{$blogpost->url}'>{$blogpost->headline}</a>";
					$out .="</h2>";
					$out .="<ul class='meta'>";
						$out .="<li class='categories'><a href='{$blogpost->Category->httpUrl}''>{$blogpost->Category->title}</a></li>";
						$out .="<li>{$blogpost->author_name}</li>";
					$out .="</ul>";
					$out .="<p>{$blogpost->abstract}</p>";
					$out .="<a href='{$blogpost->httpUrl}' class='btn'>Read more</a>";
				$out .="</div>";
			$out .="</div>";
		$out .="</div>";
	}

	
	// Pagination

	$out .="<div class='pagination'>";
	$out .= $blogposts->renderPager(array(

				    'nextItemLabel' => "Next",
				    'previousItemLabel' => "Prev",
				    'listMarkup' => "<ul>{out}</ul>",
				    'itemMarkup' => "<li>{out}</li>",
				    'linkMarkup' => "<a class='primary-color' href='{url}'>{out}</a>"   

					));
	$out .="</div>";

	echo $out;

}

Thanks again for your help.

[Joss]

The only thing in there is the rsort function - not that I can see it creating a problem, but for the sake of elimination, you might want to remove it. Not sure you really need it since you can change the order within the find() selector. 

I was hoping to see an incomplete tag somewhere - the puzzle for me is that though the random <li> is in the middle of the list, it is displayed at the end of the list - for me that normally means there is a tag out of place somewhere. But I cant see one.

[adrian]

http://validator.w3.org/check?uri=http%3A%2F%2Fanswerhub.com%2Fblog&charset=%28detect+automatically%29&doctype=Inline&group=0

Error #4

[csmith]

@Joss - Removing the rsort() did not affect the empty <li>. But interestingly enough, changing the limit of blog posts to 8 did fix the problem. No idea why that would be, though...

[Joss]

ummmmm

[csmith]

So it looks like something is generating the "..." as a way of saying there are more than ten pages, then listing the final page. In this case, there are only 11 pages, so it looks kinda silly. But bootstrap's styles are floating the <a> and not the <li> so the "empty" <li> is ending up on the end, looking even sillier. I'm working to adjust the styles so that at least the elipses will be in the right place.

[thistimj]

In the Custom Options Reference on this page: http://processwire.com/api/modules/markup-pager-nav/ , it lists an option

separatorItemLabel - The label (string) used for the list "separator". Default: …

So you might try giving it a different value, or none at all, and see if that changes anything.

[thistimj]

There's also a separatorItemClass that you can customize.

[JeevanisM]

Hello,

I am super newbie to PW. I was in touch with Wordpress and Concrete 5. Recently, I had started my search to find another CMS than Concrete 5. I have a news portal which is live now and built on Concrete 5. The address is here

http://kaakkakkoottam.com/

But the admin side of Concrete 5 is too much complicated. Plus it is taking too much loading time, extensive use of Jquery. So many times it crashed, throwing weird errors, while posting new articles. So I had to search another faster one and reached to ProcessWire

Well, I want to rebuild my portal http://kaakkakkoottam.com/ by ProcessWire. So I searched guidelines to create a news portal and found this tutorial. But the github link provided here https://github.com/jsanglier/Pw-News is no more working. I am attaching screenshot of error while I tried to access it.

Please let me know if there any chance to get this tutorial files.

thank you a lot

Jeevz
 

http://s32.postimg.org/odth3nadw/processwire_NEWS_001.jpg

[szabesz]

Hello JeevanisM and welcome to the forum!

Joss is still an active member, so I suppose he will be able to properly answer your question, but in the meantime, I would like to point out that his tutorial is rather old, and a lot of new features that make things a lot easier to implement has been added to ProcessWire since then.

Probably the most current and therefore one of the most recommended tutorials is this:
http://blog.mauriziobonani.com/processwire-basic-website-workflow-part-1/

The only "issue" with it is that is uses Twig, which you might not want to use, however, I recommend to read it anyway.

Another resource I recommend reading is the old wiki:
http://wiki.processwire.com/index.php/Main_Page

Yeah, it is old too, however it is mainly discussing general concepts which has not changed at all, so it's worth reading.

[Joss]

Hi JeevanisM

Oh, terribly, terribly old!

No idea where those files are now, to be honest, but they were built with an older version anyway.

However, it is not really necessary. Basically, the trick is in parent-child relationships.  The simplest way to build a news portal is to create a home page and then create pages under that - one for each article.

Using the PW API you can then list them on the homepage. See here:

https://processwire.com/api/ref/page/children/

The first example produces all the children in an unordered list:

<?php
echo "<ul>";
// Render navigation for all child pages below this one
foreach($page->children() as $child) {
  echo "<li><a href='$child->url'>$child->title</a></li>";
}
echo "</ul>";

You can see that you could use any html markup you like, for instance your blocks.  Processwire does not hamper what html/css/js you use - just think of the /site/templates/ folder as the root of your site and put it together as you would do for a static site - just with the API, if you get my drift.

Now, that is the simplest example, but you can go lots of ways from there.

If you wanted to have simple categories, then you can create category pages under your home page and then articles under those:

home

-- news

-- -- I lost the election

-- sport

-- -- I won the race

-- food

-- -- I got fat

That is the most logical site and you can use the parent-child relationships in the api to list things.

With this sort of site, you can almost get away with creating just one template-file and using it for everything, as long as you want everything to look the same.

However, you can get much more complicated. 

Using the Page Field, this allows you to list pages in your template that have a specific parent. So, for instance, you can use this for tags.

Home

-- tags (hidden page)

-- -- tag1

-- -- tag2

By being hidden, the tags parent page does not appear in any menu structure you may create and nor is it accessible easily. However, the tag pages, the children are.

Using a page field, you can now list those pages as a select dropdown. But you can also tell the field to allow you to create new pages from the dropdown - making it a perfect tagging system.

Just a note: Don't be put off by the expression "page." In processwire, that is basically one data record. It can contain just one field or hundreds - doesn't matter. Basically, everything chunk of data that relates to a template is a page - but may not be used as a "web page" as such. However, it means all data, however simple, is treated uniformly throughout the entire system and is accessible using the API.

There you go - not a tutorial as such, but maybe some clues for you.

Good luck

[szabesz]

While discussing categories, we must not forget kongondo's evergreen write up on the subject

https://processwire.com/talk/topic/3579-tutorial-approaches-to-categorising-site-content/

[JeevanisM]

Hello All,

I have setup PW in my local machine.  I chose the beginner profile which gave me a demo website. Now, I have few questions. I created two more templates files. Those

are  category.php and article.php  

category,php I use for listing all child pages under one particular page. artilce.php is the template to display full content of the page.  Now I have few doubts and need help.

I . How can  I get thumbnail of all child pages for a particular category page ? I understand

renderNav($page->children);

produce  title and summary of child pages. But it doesnt  grab the thumbnail of those page. I need to display  with in a cute DIV ( thumbnail + child page title / summary ) of all child pages. This is like we display news articles in the home page.  how can I get thumbnail of child pages and display?

I tried with thumbnail plugin, installed and tried the code but no use.

please help

thanks

[Joss]

I have not used the beginner profile, so I have no idea what is in it.

However, in the docs, there is a guide to how to retrieve images from an image field, which includes specifying the size

https://processwire.com/api/fieldtypes/images/

Also in the docs, dig through the tutorials that various people have written - lots of clues there

[JeevanisM]

Beginner profile means its just fill dummy data when install PW, nothing else. Btw, too sad not much documentation for simple requirements like thumbnail grab for pages. I tried a few ways but not getting enough. Seems like I should  stick on with concrete 5