Jump to content

Recommended Posts

Actually FieldtypeComments already has built in support for Gravatar. Never tried it though and don't know how to use it. I have looked at the code but can't figure this out. I also don't have a Gravatar account so can't test anyway. Anybody knows how to use this and willing to help us out with this? Hopefully Ryan will also see this. Thanks.

  • Like 2

Share this post


Link to post
Share on other sites

@kongondo Thanks for the module. Great work.

Having a look I noticed there is no featured image option for the posts.

It is quite common to add a featured photo at the top of a post and to have it on the side or top of each post listed on the blogs home page.

Is that something you are looking to add or is there a way to add it to renderPosts()?

  • Like 1

Share this post


Link to post
Share on other sites

@Dazzyweb,

Thanks for reminding me about this. Actually the feature had previously been requested by Adrian but I never got round to it :-). I was not sure how best to implement it but taking up your renderPosts() suggestion and coupled with Adrian's ideas, I have now come up with a workable solution. I will post an updated Blog version in its GitHub dev branch in the next couple of hours for testing, suggestions, etc.

  • Like 1

Share this post


Link to post
Share on other sites

Upcoming update: Blog version 2.1.0. (dev)

Summary of Changes: Added 'Small' Posts Featured Image setting

EDIT: Note that the implementation of this feature has slightly changed. See this update:

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

As requested, Blog version 2.1.0 now includes a 'featured image' setting that can optionally be used when displaying a summary of posts (i.e. small/summarised/truncated posts). I haved added this to the dev branch for testing and comments, thanks.

It is implemented by including a third argument/parameter to renderPosts(),i.e.

renderPosts($posts, $small = false, Array $featuredImage = null)

Only if $small = true and $featuredImage is also specified, does the setting kick in. $featuredImage must be an array of options to apply to the featured image as described below:

  • First, renderPosts() will look for the first image with the default or specified tag (see below) in the post's blog_images field
  • If no image found, it will then look for the first image embedded in blog_body (i.e. the body of the post). Here it uses PHP's DOMDocument class.
  • if we find an image, we output it in ,<div class=post-body> just before the truncated post text (see screens below). The image is given the class <img class='post-small-featured-image'>
  • If no image found, nothing is output and we move to the next post...etc...

The above means that you can mix and match where your featured image will come from...

The default image options are:

//default featured image options
$defaultOptions = array(
			'width' => '',//no width manipulation if this blank
			'height' => '',//no height manipulation if this blank. Note, if size is true and both width and height > 0, use size() instead
			'alt' => 'description',//defaults to $image->description. Otherwise other stated field on the page, e.g. = 'title'
			'tag' => $this->_('featured'),//string: image tag to look for in blog_images			
			//size: image will be resized to exact dimensions -> $img = $image->size($x, $y)
			//where $x = 'width' and $y = 'height'
			'size' => false,//if 'size' = true AND both width and height > 0, this kicks in
);

Above are self-explanatory but let me clarify a few things regarding the order of implementation.

You don't have to specify any/all options if you are happy with the defaults, so you can do...

//render a limited number of summarised posts + show featured image
$featured = array('tag'=>'thumb', 'width'=>350, 'alt'=>'title');

$content = $blog->renderPosts("limit=5", true, $featured);
echo $content;

For featured blog_images

In descending order, the order of image dimension manipulations for a featured image coming from blog_images as set in your $featuredImage options will be processed as follows (note: only one manipulation takes place! i.e., if, elseif, else...)

(see what these mean in the Images docs)
  • size = true AND width > 0 AND height > 0: $thumb = $image->size($x, $y);//where $x=stated width and $y=stated height
  • width > 0: $thumb = $image->width($x);//where $x=stated width
  • height > 0: $thumb = $image->height($y);//where $y=stated height
  • No height AND no width stated: $thumb = $image;/i.e. original image output at original dimensions
Also:
  • alt: defaults to '$image->description'. If anything else is specified, then alt = $page->field where field is the given value in alt. e.g. if 'alt'=>'title', alt=$post->title
  • tag: defaults to 'featured' but will take any string you specify in 'tag'=>'mytag'.
 
For embedded images
  • These are not subject to ProcessWire image methods. So there are no width, height manipulations
  • If height and/or width > 0 is specified in $featuredImage options, these will be output in the img tag.
 
In both cases, of course, you can still use CSS to control image dimensions and position.
 
Some examples
 
If you pass the following options to $featured in renderPosts("limit=5", true, $featured);
 
/*will get first blog_images with tag='thumb'. Image width will be resized to 350, height proportionately calculated and post->title will be alt (i.e., post page's title). No size() applied since not specified so also height ignored. So no need to specify it here!*/
$featured = array('tag'=>'thumb', 'height' => 300, 'width'=>350, 'alt'=>'title');

/*same as above except image height resized to 300 and width auto calculated*/
$featured = array('tag'=>'thumb', 'height' => 300, 'alt'=>'title');

/*$image->size($x, $y) applied*/
$featured = array('tag'=>'thumb', size=>true, 'height' => 300, 'width'=>350, 'alt'=>'title');

/*no manipulations; original image output since no height and width specified with size. alt=$post->caption. So no need to specify size here!*/
$featured = array('tag'=>'thumb', size=>true, 'alt'=>'caption');

/*output first embedded image giving it height and width dimensions - In this case will only work if blog_images does not contain an image tagged 'featured'*/
$featured = array('height' => 300, 'width'=>350, 'alt'=>'title');

/*output first embedded image. In this case, doesn't matter if you tagged your blog_images or not*/
$featured = array('tag' => '');
Note:

If you will be using blog_images to hold your featured image, you will have to enable use 'tags' in the field's settings (Detail's tab). I have decided not to enable this setting by default when Blog is installed since 'featured image' is an optional thing.

This will not work with images embedded using Hanna Code since such will be output when page is rendered. To make things as light as possible, DOMDocument above looks in the blog_body html string retrieved from the database. If anybody has other thoughts please let me know, thanks.

 
 
I will update Blog docs when this is committed to master.
 
Thanks for testing.
 
Screens (with custom CSS styles applied to img.post-small-featured-image)
 
Float left
post-894-0-79294700-1413848937_thumb.png
 
Float right
post-894-0-03144500-1413848940_thumb.png
 
Top, no float
post-894-0-87608500-1413848942_thumb.png
Edited by kongondo
  • Like 3

Share this post


Link to post
Share on other sites

Thanks Kongondo. Blog module is just getting better and better.

BTW I've had the issue in the past where I've needed a "featured image" with each post.
Using your older Blog Module, I've just told editors that the first image in the images field will be the featured one and it's worked perfectly.

They know they can reorder images as required so have very few probs that way.

  • Like 1

Share this post


Link to post
Share on other sites

I just tested it and it works fine thanks.

I wanted the featured image above the headline so I am just wondering what the best way is to customise the output / markup a little more.

For example I would like the featured image to be above post-headline and maybe the post-byline below the post-body.

I know I could go in and change the renderPosts() method but would prefer not to change the plugin to do this.

Share this post


Link to post
Share on other sites

Featured image above post-headline

I'll mull over this one but can probably add a position=>above//below in $featuredImage options. Just to be sure, you mean something like this or this or this yes?

post-byline below the post-body

This one I am not sure about whether I want to change the current behaviour..

Share this post


Link to post
Share on other sites

Just a heads up. 

I installed the blog module and it looks and worked great.

ONE HUGE ISSUE HOWEVER...

- as this module adds a few fields to the users interface screen (display name, bio etc) when I fill in an actual display name and save it and then log out and try and log back in the admin area I'm unable to. Unable to reset password by any means.

No clue why this would happen but I've tested it twice. I'm running version 2.5.2

Luckily I had recent backups of my dbase to recover or else this would have left me high and dry.

Has anyone else seen this issue as its a big one in my eyes

Share this post


Link to post
Share on other sites

Shouldn't layout be left to devs template preferences? I like my modules not to assume any layout prefs.

Also, any plans to email admins for new comments?

Share this post


Link to post
Share on other sites
Chris,

This is a total stab in the dark here, but any chance you also had either the AutoName or PageRenameOptions module installed?

There was a bug in both that allowed for system template names to be changed - would only happen to the user template if the title field was added (it's not there by default, but it is added with this module).

The bug has been fixed on both modules as of today, so if that was the issue, make sure you update those modules and everything should be fine.

The good thing to know is that it would have just been a matter of opening up PHPMyAdmin to see the name of the user in the database - log in with that and you'd have been fine.

So very sorry if it was one of those modules that caused the problem, but glad you managed to restore things ok.

If not, I'll defer to kongondo.

  • Like 1

Share this post


Link to post
Share on other sites

Just a heads up. 

I installed the blog module and it looks and worked great.

ONE HUGE ISSUE HOWEVER...

- as this module adds a few fields to the users interface screen (display name, bio etc) when I fill in an actual display name and save it and then log out and try and log back in the admin area I'm unable to. Unable to reset password by any means.

No clue why this would happen but I've tested it twice. I'm running version 2.5.2

Luckily I had recent backups of my dbase to recover or else this would have left me high and dry.

Has anyone else seen this issue as its a big one in my eyes

@Chris,

Sorry about your troubles. This is very strange. It has not been reported before nor have I experienced it. Blog does not touch your PW 'user' credentials at all. Please clarify a few things:

  1. Can you confirm what version of Blog you are running?
  2. It may sound silly, but confirm when you are trying to log back in, are you using your username or Blog's display name?
  3. Do you get any error messages when you try to log back in? What are those messages?
  4. Are you logging back in as an Admin?

Share this post


Link to post
Share on other sites

Shouldn't layout be left to devs template preferences? I like my modules not to assume any layout prefs.

Also, any plans to email admins for new comments?

  1. Yes ; isn't that what this module is already doing?  O0
  2. No  :P......Here's why... :-[  ;) {also see the G thing...}

post-894-0-98235300-1413929474_thumb.png

  • Like 2

Share this post


Link to post
Share on other sites

Upcoming Update: Blog version 2.1.1 (dev)

Update as per request to allow user to control position of featured image  - either above post-headline or below post-body. Default is, if present, output featured image below post-body.

To output a featured image above the post-headline, include the 'key'=>'value' pair 'position'=>'above' in the $featuredImage options array, .e.g.

$featured = array('tag'=>'thumb', 'width'=>550, 'position'=>'above');
echo $blog->renderPosts("limit=5", true, $featured); 

For new readers, also refer to the original Blog 2.1.0 post above. Feature available in the dev branch for testing, thanks.

Screenshot

post-894-0-86242200-1413934637_thumb.png

  • Like 1

Share this post


Link to post
Share on other sites

OK, I have had a rethink in respect of the second request here (post-by line below post body) and the first issue here... :-). Similar to renderComments() where you can customise comments' visibility status texts, I am working on making the currently hard-coded 'posted by', 'posts 1 to 1 of 20', 'view more', etc (including their visibility and position where applicable) customisable.

The 3rd argument of renderPosts() will now be Array $options and will cater for various aspects of the rendered post. If you have any requests please post them here and I will consider them, thanks.

Share this post


Link to post
Share on other sites

@kongondo

I have installed 2.0.2 and am working on the frontpage of my site. The two latest news items are shown like this.

<div class="block-group">
	<div class="block width100">
		<?php
			$blog = $modules->get("MarkupBlog");
			echo $blog->renderPosts("limit=2", true);
		?>
	</div>
</div> 

 Is it possible to print them next to each other. Perhaps call items twice? Call 1st item, then skip 1st and call 2nd item

<div class="block-group">
	<div class="block width50">
		<?php
			$blog = $modules->get("MarkupBlog");
			echo $blog->renderPosts("limit=1", true);
		?>
	</div>
	<div class="block width50">
		<?php
			$blog = $modules->get("MarkupBlog");
			echo $blog->renderPosts("limit=1", true);
		?>
	</div>
</div>

Share this post


Link to post
Share on other sites

@toothpaste,
 
Yes, it is technically possible to call items twice but wholly unnecessary :-). Btw, if you did that, there is no need to call $modules->get('MarkupBlog') twice. Calling it once is enough on the same template file. Anyway, back to the issue. You can easily achieve what you asked - having two posts (or 3 or 10 or whatever) side by side by just using CSS. All blog posts are wrapped in divs as follows:

 <div class="posts">
    <div class="post">Post number 1</div>
    <div class="post">Post number 2</div>
    <div class="post">Post number 3</div><!-- etc, etc. -->
</div><!-- end parent div.posts--> 

  
What you want to do is to target the div.post with CSS to make them float side by side. Now, directly targeting div.post in your CSS may obviously affect other instances of div.post elsewhere (e.g. in blog-post). So, what you want to do is probably to wrap div.posts in your custom div like so:

<div id="wrapper">
  <div class="posts">
    <div class="post">Post number 1</div>
    <div class="post">Post number 2</div>
  </div><!-- end parent div.posts-->
</div><!-- end parent div#wrapper-->

You can then easily target each div.post with your CSS.

Share this post


Link to post
Share on other sites

@kongondo Thanks for all your work on the blog module and responsiveness to any requests.

It would be great to be able to customise and control the output of the posts a bit more since there are many possibilities of how a post could be displayed or certain elements of a post displayed somewhere else on the page.

For example I might want to put the post headline at the top of the page on a featured banner photo then have the actual post shown lower down in the main body of the page. At the moment this doesn't seem possible.(this was one option I was thinking about for a blog I am making now)

Another thing I have been thinking about is how I would be able to add for example social media like buttons to each post when several posts are listed on a page or how I could put like buttons somewhere on a post other than at the very top or bottom of a single post shown.

Share this post


Link to post
Share on other sites

@dazzyweb,

I don't follow: 

For example I might want to put the post headline at the top of the page on a featured banner photo then have the actual post shown lower down in the main body of the page. At the moment this doesn't seem possible.(this was one option I was thinking about for a blog I am making now)

Are you talking about a full post as output e.g. in blog-post.php or are you talking about summary of posts, e.g. on blog-posts.php? If the latter, I have already implemented that as per your request yesterday. What is a featured banner photo in this case? Where is it coming from? Can you show me some examples/illustrations please?

Another thing I have been thinking about is how I would be able to add for example social media like buttons to each post when several posts are listed on a page or how I could put like buttons somewhere on a post other than at the very top or bottom of a single post shown.

Without jQuery or similar you can't at the moment. Again, are you talking truncated ($small) posts or full posts or full listed posts (e.g. on blog.php)? I'd like to see some illustrations/examples though... :-)

Share this post


Link to post
Share on other sites

Are you talking about a full post as output e.g. in blog-post.php or are you talking about summary of posts, e.g. on blog-posts.php? If the latter, I have already implemented that as per your request yesterday. What is a featured banner photo in this case? Where is it coming from? Can you show me some examples/illustrations please?

I mean as in blog-post.php whereby the post headline for the post can be extracted and inserted into a main photo  but removed from the rest of the post something like these examples shown here. https://www.heartinternet.uk/blog/article/were-sponsoring-confconf-2015 or here http://wplift.com/best-free-wordpress-themes-oct-2014 This can also be seen to work on small posts like here: http://wplift.com/

Without jQuery or similar you can't at the moment. Again, are you talking truncated ($small) posts or full posts or full listed posts (e.g. on blog.php)? I'd like to see some illustrations/examples though... :-)

I was talking about both in a way. With small posts something like this: https://www.heartinternet.uk/blog and full listed posts something like this http://wplift.com/best-free-wordpress-themes-oct-2014

Share this post


Link to post
Share on other sites

The problem with a module like this is that it is unlike WP with its many themes which have different layouts :D..

For #1: I think you can easily pull that off with CSS. What I will need to add however, is the option to also output a featured image for a full single post [blog-post.php] (currently I have implemented this for $small posts only). Same as the current implementation, one will have the choice for that to be output either above the post-headline or below the post-body. In your case you'd probably go for 'above' post-headline and using CSS you can place your headline on top of the featured image. I'll try show you example CSS on how to do it...

For #2: I will need to think about how those can be implemented (forum any/all ideas welcome, thanks!). I think it is an important feature. This will probably have to be implemented on the GUI side. It will have to be configurable, i.e. what social media sites to show, their icons, etc...This feature may have to wait for a while though...I want to get it right... :-)

Thanks for the ideas.

  • Like 1

Share this post


Link to post
Share on other sites

I am not sure if this is possible and maybe a bit of work to implement but I imagine a 2 textareas where the markup can be customised for the post or posts.
One for full posts (blog-post.php) and one for truncated posts ($small).

In each of these textareas html and short codes or variables could be entered which represent different parts of the post such as [featured] and [post-headline] etc...

Then this is output with renderPosts()
 

Share this post


Link to post
Share on other sites

kongondo, to answer some of your questions in regards to the blog changing username...

  1. Can you confirm what version of Blog you are running? - ANSWER: 2.0.2
  2. It may sound silly, but confirm when you are trying to log back in, are you using your username or Blog's display name? ANSWER - YES USING PROPER USERNAME NOT BLOG DISPLLAY NAMES
  3. Do you get any error messages when you try to log back in? What are those messages? ANSWER - NO ERRORS
  4. Are you logging back in as an Admin? ANSWER - YES

Here's what I found doing more research...

 

When I go and edit a user after installing the blog the Display Name is now required field which is fine. When you add a name ie. John Doe it actually changes the actual name field (the actual username field).

 

So as an example I had a user whos username was 'test555' I changed their Display Name (required by the blog) to be Jane Doe and low and behold it changes the actual Name (username) to jane-doe so it's actually renaming the username.

 

I saw a mention of this item: AutoName or PageRenameOptions module installed which they are so I'll try updating those and report back to see if that fixed anything

 

 

 

 

Share this post


Link to post
Share on other sites

happy to report that by upgrading to latest Page Rename Options that this bug has been fixed for me. It was a bit scary when actual usernames were being modified when you added/edited your display name and I couldn't gain access but this update to version 0.1.4 seems to fix it. This would have been a serious issues for my clients to say the least.

Thanks for that insight Adrian, appreciate it!!

  • Like 1

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    No registered users viewing this page.

  • Similar Content

    • By gebeer
      Although the PW backend is really intuitive, ever so often my clients need some assistance. Be it they are not so tech savvy or they are not working in the backend often.
      For those cases it is nice to make some help videos available to editors. This is what this module does.
      ProcessHelpVideos Module
      A Process module to display help videos for the ProcessWire CMS. It can be used to make help videos (screencasts) available to content editors.
      This module adds a 'Help Videos" section to the ProcessWire backend. The help videos are accessible through an automatically created page in the Admin page tree. You can add your help videos as pages in the page tree. The module adds a hidden page to the page tree that acts as parent page for the help video pages. All necessary fields and templates will be installed automatically. If there are already a CKEditor field and/or a file field for mp4 files installed in the system, the module will use those. Otherwise it will create the necessary fields. Also the necessary templates for the parent help videos page and it's children are created on module install. The module installs a permission process-helpvideos. Every user role that should have access to the help video section, needs this permission. I use the help video approach on quite a few production sites. It is stable so far and well received by site owners/editors. Up until now I installed required fields, templates and pages manually and then added the module. Now I added all this logic to the install method of the module and it should be ready to share.
      The module and further description on how to use it is available on github: https://github.com/gebeer/ProcessHelpVideos
      If you like to give it a try, I am happy to receive your comments/suggestions here.
    • By Robin S
      A module created in response to the topic here:
      Page List Select Multiple Quickly
      Modifies PageListSelectMultiple to allow you to select multiple pages without the tree closing every time you select a page.
      The screencast says it all:

       
      https://github.com/Toutouwai/PageListSelectMultipleQuickly
      https://modules.processwire.com/modules/page-list-select-multiple-quickly/
    • By gebeer
      Hello all,
      sharing my new module FieldtypeImagePicker. It provides a configurable input field for choosing any type of image from a predefined folder.
      The need for it came up because a client had a custom SVG icon set and I wanted the editors to be able to choose an icon in the page editor.
      It can also be used to offer a choice of images that are used site-wide without having to upload them to individual pages.
      There are no image manipulation methods like with the native PW image field.
      Module and full description can be found on github https://github.com/gebeer/FieldtypeImagePicker
      Kudos to @Martijn Geerts. I used his module FieldTypeSelectFile as a base to build upon.
      Here's how the input field looks like in the page editor:

      Hope it can be of use to someone.
      If you like to give it a try, I'm happy to hear your comments or suggestions for improvement. Eventually this will go in the module directory soon, too.
    • By bernhard
      @Sergio asked about the pdf creation process in the showcase thread about my 360° feedback/survey tool and so I went ahead and set my little pdf helper module to public.
      Description from PW Weekly:
       
      Modules Directory: https://modules.processwire.com/modules/rock-pdf/
      Download & Docs: https://github.com/BernhardBaumrock/RockPDF
       
      You can combine it easily with RockReplacer: 
      See also a little showcase of the RockPdf module in this thread:
       
    • By ukyo
      FieldtypeFontIconPicker
      Supported Icon Libraries
      FontAwesome 4.7.0 Uikit 3.0.34 IonicIcons 2.0.1 Cahangelog
      NOTE: Module store data without prefix, you need to add "prefix" when you want to show your icon on front-end, because some of front-end frameworks using font-awesome with different "prefix".
      Module will search site/modules/**/configs/IconPicker.*.php and site/templates/IconPicker.*.php paths for FieldtypeFontIconPicker config files.
      All config files need to return a PHP ARRAY like examples.
      Example config file : create your own icon set.
      File location is site/configs/IconPicker.example.php
      <?php namespace ProcessWire; /** * IconPicker : Custom Icons */ return [ "name" => "my-custom-icons", "title" => "My Custom Icon Set", "version" => "1.0.0", "styles" => array( wire("config")->urls->templates . "dist/css/my-custom-icons.css" ), "scripts" => array( wire("config")->urls->templates . "dist/js/my-custom-icons.js" ), "categorized" => true, "attributes" => array(), "icons" => array( "brand-icons" => array( "title" => "Brand Icons", "icons" => array( "google", "facebook", "twitter", "instagram" ) ), "flag-icons" => array( "title" => "Flag Icons", "icons" => array( "tr", "gb", "us", "it", "de", "nl", "fr" ) ) ) ]; Example config file : use existing and extend it.
      File location is site/configs/IconPicker.altivebir.php
      <?php namespace ProcessWire; /** * IconPicker : Existing & Extend */ $resource = include wire("config")->paths->siteModules . "FieldtypeFontIconPicker/configs/IconPicker.uikit.php"; $url = wire("config")->urls->templates . "dist"; $resource["scripts"] = array_merge($resource["scripts"], ["{$url}/js/Altivebir.Icon.min.js"]); $resource["icons"]["flag-icons"] = [ "title" => "Flag Icons", "icons" => array("tr", "en", "fr", "us", "it", "de") ]; $resource["icons"]["brand-icons"]["icons"] = array_merge($resource["icons"]["brand-icons"]["icons"], array( "altivebir" )); return $resource; After you add your custom config file, you will see your config file on library select box. Library Title (Location Folder Name).

      If your library categorized and if you have categorized icons set like uikit and fontawesome libraries, you will have category limitation options per icon field or leave it empty for allow all categories (default).

      Example : output
      if ($icon = $page->get("iconField")) { echo "<i class='prefix-{$icon}' />"; } MarkupFontIconPicker Usage
      // MarkupFontIconPicker::render(YourIconField=string, Options=array) echo MarkupFontIconPicker::render($page->YourIconField, [ 'prefix' => 'uk-icon-', // Icon class prefix, if you have different prefix, default is : "fa fa-" 'tag' => 'span', // Icon tag default is : "i" 'class' => 'fa-lg', // If you have extra cutom classes, for example : icons sizes, Array or Sting value 'style' => 'your custom styles if you have' // Array or String Value ]); Theme support

      Search support

      Category support

       
×
×
  • Create New...