Loading...
 

Proposal for Blog and News Pages Redesign 2019

Tiki blogs and news (articles) pages are looking out of date, and aren't keeping up with web design trends. This page is to discuss and move forward on a proposal to redesign the structure/layout of these pages and lay the groundwork for new designs that stand out and are more elegant. Please edit this page to add ideas, comments, questions, etc. about the appearance and function of Tiki's blog pages and news pages.


(The idea for this page came out of some initial discussion by Marc, Bilal and Yves Dax and Gary.)

Timeline

Suggested but open to discussion: Maybe low hanging fruit and quick fixes and style improvements can be taken care of for Tiki 20, and more extensive revamping for Tiki 21.

Steps in the process

  • Identify characteristics of leading blog and web news page designs and note where Tiki is falling short.
  • Check what information/functionality needs to be on the pages and plan where it should be placed, for example by using wireframes.
  • Plan/edit Smarty template files to position the information (try to provide design flexibility as much as possible).
  • Improve packaged themes' styling of these pages.
    • Looking at current (Tiki 19 or trunk) blog pages, what should be changed/improved on the theme level?
    • Currently blog posts are displayed in Bootstrap div.card elements. In many themes, this has a border and div.card-header has a background color. Does this cause too much of a dated "info in a box" appearance?
      • Proposed action: I looked at a lot of contemporary blog page layouts/designs and almost all of them simply use white space and font styles rather than borders and background colors to present blog post information. My plan is to override the .card div border and background color properties for blog posts as a default and then let themes reinstate them (totally or partially like maybe having horizontal border separators) where it matches the theme's look and for variety. Update: changes committed for Tiki 20.
  • Possibly produce new themes focusing on blog/news presentation (but actually all the packaged themes should present these pages well).
  • Enable optional layout(s) for blog top page such as Pinterest-style grid of cards, one for each blog post intro. A similar thing could be done for the articles feature.

Specific issues

  • Check and Solve any issue with Social Network (Facebook, Twitter, etc) so Blogpost and Articles are sharable, likeable properly and published automatically where it needs to.
  • ...too many redirections detected by Facebook - Bernard.
  • Be able to upload an image and post about it in the same form (ideally [also] from phone) - jonnyb.
  • ...Facebook does not grab the right image to display on posts. It would be nice if the blog-article image was the one grabbed, and not the site logo or other image used. I mean the nice large image you're talking about that describes the post. Don't know if my experience with article-blogs was before or after the past revamp - Brendan.
  • ...Feeds registering updates to an article (or blog?) with duplicate entry - Brendan.
  • About comments - Brendan
    • Instead of “0 comments” it would be nice if it read something like “Be the first to comment” or something of that sort.
    • Clicking on the comments link should bring you to the place on the page where the comments are, not the top of the article.
    • If you need to be logged in to comment, there should be a link that says “Log into to comment” with a link to the login page, instead of "There are no comments at this time.”
  • Currently, at the top of an article, it reads "Author: Author Name - datetime" (or timeago). Perhaps this could be less formal. Or maybe when timeago is enabled it could read like the relative times something like “By Dr Sassafras 1 day ago” instead of "Author: Dr Sassafras - 1 day ago”. Or something in this train of thought to makes it a little more informal, and read a little bit better. - Brendan
  • The top of the blog page is dominated by the Find form: the input is 50% of the page width and there is a "Displayed rows" input that (IMO) is not needed and is visually distracting. I suggest making "Find" more subtle, like narrowing the input and putting the button inline, and removing the "Displayed rows".

  • Blog Revamp in 2014 with many good results. The page has a lot of blog feature information and comparisons with other platforms.
  • Overall informational redesign of tiki.org (reduce the clutter of links and make it easier for users to find information).
  • Redesign the landing page/homepage.
  • Consider/carry out merging "info.tiki.org" and the community site.


Contributors to this page: Gary Cunningham-Lee and Bernard Sfez / Tiki Specialist .
Page last modified on Saturday 29 June, 2019 07:15:03 GMT-0000 by Gary Cunningham-Lee.

Keywords

The following is a list of keywords that should serve as hubs for navigation within the Tiki development and should correspond to documentation keywords.

Each feature in Tiki has a wiki page which regroups all the bugs, requests for enhancements, etc. It is somewhat a form of wiki-based project management. You can also express your interest in a feature by adding it to your profile. You can also try out the Dynamic filter.

Accessibility (WAI & 508)
Accounting
Administration
Ajax
Articles & Submissions
Backlinks
Banner
Batch
BigBlueButton audio/video/chat/screensharing
Blog
Bookmark
Browser Compatibility
Calendar
Category
Chat
Comment
Communication Center
Consistency
Contacts Address book
Contact us
Content template
Contribution
Cookie
Copyright
Credits
Custom Home (and Group Home Page)
Database MySQL - MyISAM
Database MySQL - InnoDB
Date and Time
Debugger Console
Directory (of hyperlinks)
Documentation link from Tiki to doc.tiki.org (Help System)
Docs
DogFood
Draw
Dynamic Content
Preferences
Dynamic Variable
External Authentication
FAQ
Featured links
Feeds (RSS)
File Gallery
Forum
Friendship Network (Community)
Group
Help
History
Hotword
HTML Page
i18n (Multilingual, l10n, Babelfish)
Image Gallery
Import-Export
Install
Integrator
Interoperability
Inter-User Messages
InterTiki
jQuery
Kaltura video management
Karma
Live Support
Logs (system & action)
Lost edit protection
Mail-in
Map
Menu
Meta Tag
Missing features
Visual Mapping
Mobile
Mods
Modules
MultiTiki
MyTiki
Newsletter
Notepad
OS independence (Non-Linux, Windows/IIS, Mac, BSD)
Organic Groups (Self-managed Teams)
Packages
Payment
PDF
Performance Speed / Load / Compression / Cache
Permission
Poll
Profiles
Quiz
Rating
Realname
Report
Revision Approval
Scheduler
Score
Search engine optimization (SEO)
Search
Security
Semantic links
Share
Shopping Cart
Shoutbox
Site Identity
Slideshow
Smarty Template
Social Networking
Spam protection (Anti-bot CATPCHA)
Spellcheck
Spreadsheet
Staging and Approval
Stats
Survey
Syntax Highlighter (Codemirror)
Tablesorter
Tags
Task
Tell a Friend, alert + Social Bookmarking
Terms and Conditions
Theme
TikiTests
Timesheet
Token Access
Toolbar (Quicktags)
Tours
Trackers
TRIM
User Administration
User Files
User Menu
Watch
Webmail and Groupmail
WebServices
Wiki History, page rename, etc
Wiki plugins extends basic syntax
Wiki syntax text area, parser, etc
Wiki structure (book and table of content)
Workspace and perspectives
WYSIWTSN
WYSIWYCA
WYSIWYG
XMLRPC
XMPP




Useful Tools