Blog Article Component for Smartphone
The template part of smart phone blog article page. This part is used with Smartphone Next and Prev article.
The desktop browser version is Blog Article.
The appearance of this page is below.
This part shows the content of blog article. In addition to that, it replaces the big image into the small image, and replaces link url of desktop page into smart page's one.
Max size of image is different from the mobile device's screen width, therefore it uses style sheet to adjust image size to show finally.
This template part consists of Html and Style Sheet.
The Html of blog article part for smart phone is below.
This Html is simply shows the update, created time and the article content. The article content is converted into one of smart phone in the server side script.
The style sheet for the Html is below.
This style sheet specifies the style of div tag whose id is "#blog-post", and the inner tags. The style sheet defines the max size of the image and iframe by percentage.
The server side program to get variables used in the Html is below.
This program does following operations.
- Get current content from document node by SELECT SQL.
- Calculate mobile page's path.
- Convert content into one ready for smart phone by HtmlSmartPhone.replaceImageAndHref() function.
- Format the blog article's created and updated timestamp.