My personal blog


#1

Nothing special. Main idea was to abandon the Facebook Notes app and creating my own solution. This is my personal blog (Polish language) created with Blocs 2.4.5 and additional PHP script. Blog PHP script is “injected” to various places of the webpage. Filtering by categories are working only on a main page through DIV filtering using javascript, this is a temporary solution and will be rewritten and transfered to PHP script. Any page could be printed easily, entire blog or single post. Data of the blog is maintained by the RSS file which is read and displayed on the webpage by PHP script in desired way. Why such a solution? This is really simple to use. I edit the new posts using Macdown app and html result is pasted as description to a new RSS item in ecoFeed app, then I update the changes and additional graphic files through FTP. Pros: no database, simplicity and lack of problematic dependencies. Cons: inability to editing the blog with mobile solutions. Some things on this website still waits for corrections and I have very small amount of time for writing some new posts … :wink:

BTW. This site has only one page (!)


Blog page with Blocs 3
#2

Congratulations for your idea.
It is very interesting
Best regards


#3

Thanks, maybe someone will develop this idea or improve it. I’m not a PHP programmer, The script is written by the other person with my guidance.


#4

There is several additional things to mention about this project, e.g. many different favicons to choose from, see the source:

<link rel="apple-touch-icon" sizes="57x57" href="./favicon/apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="./favicon/apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="./favicon/apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="./favicon/apple-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="./favicon/apple-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="./favicon/apple-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="./favicon/apple-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="./favicon/apple-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="./favicon/apple-icon-180x180.png">
<link rel="icon" type="image/png" sizes="192x192"  href="./favicon/android-icon-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="./favicon/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="./favivon//favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="./favivon/favicon-16x16.png">
<link rel="manifest" href="./favicon/manifest.json">
<meta name="msapplication-TileColor" content="#ffffff">
<meta name="msapplication-TileImage" content="./favicon/ms-icon-144x144.png">
<meta name="theme-color" content="#ffffff">

It would be nice to have the ability to add the website shortcut icon on the iPad, iPhone, Android or Windows Phone desktop … You can test what I did. If you like it, there is a simple way to put it into your project. I described it in one of my posts.


#5

I wish the blog had columns.


#6

What do you mean exactly …?


#7

It’s a lot harder to read text that stretches from one side of a browser window to the other if it’s a desktop/tablet, so breaking up the text into columns like you see in a newspaper or magazine makes the text easier to read.

Most blogs have narrower columns and use the space at the side for images/advertising/white space.

Unless the subject really interests me, I just won’t read text presented in large slabs like that.


#8

It’s very interesting comment @pauland . I would never think about this subject this way … Thanks for the comment (!) :slight_smile:


#9

Blocsapp doesn’t specifically support multiple columns, but you can adopt the multi-column blocs to get a column layout.

It’s not my notion that sabs of text are hard to read (I often comment about it), it’s well accepted and there is even CSS support for it in some browsers.

It’s not compulsory to use columns and you’ll see that people use another technique - using whitespace or other content to restrict a single column to a readable width.


#10

“It would be nice to have the ability to add the website shortcut icon on the iPad, iPhone, Android or Windows Phone desktop … You can test what I did. If you like it, there is a simple way to put it into your project. I described it in one of my posts.”

Have you tried this link for generating favicon? It works across most platforms.

I also found it hard to read with the wide text length. Pauland sent me this article a while back that really helps.

https://baymard.com/blog/line-length-readability

Casey


#11

@casey1823 I used another one: https://www.favicon-generator.org
Thanks for a link to article about readability! :wink:


#12

Thanks for the article! :nerd_face:


#13

Since I do not think about any monetization of my blog, I decided to simply use an Bootstrap Offset feature to increase the readability of the text … :wink: Greetings.


#14

Next thing - I improved the favicon. Now is generated through the script advised by casey1823 a few lines above. Script is very useful and generates a code which is better than that I proposed. The php script which doing the RSS feed rendering on this website also supports the Facebook Open Graph tags, which I don’t mention before (it’s very important!). The Open Graph logo is always the same for every link published on Facebook (for simplicity), there is no separate image for every post (it’s not necessary)… It’s all the news for now. :wink:


#15

There is another version of this website. Improvements:

  1. Displaying the list of articles using categories
  2. Excerpts of articles on the front page
  3. Improved readability and printing of the articles
  4. Additionally - help about the using a website and terms of usage as the modal windows. (help = “?” button, terms of usage = “informacje prawne” link on the bottom of the page)

There is additional script used to create website sitemap, it may be used with Cron or something like that.

This solution to maintain my blog is lightweight, portable and flexible. It is able to be used with almost any of the web page template or theme.


#16

Today I did some cosmetic changes.


#17

Next changes in this project:

  • friendly links (for better SEO)
  • improved the RSS feed W3C validation

Will be more soon