{"id":2191,"date":"2020-03-14T22:49:26","date_gmt":"2020-03-14T22:49:26","guid":{"rendered":"https:\/\/ultering.com\/it4us\/?page_id=2191"},"modified":"2020-12-13T15:57:44","modified_gmt":"2020-12-13T16:27:44","slug":"howto","status":"publish","type":"page","link":"https:\/\/ultering.com\/it4us\/?page_id=2191","title":{"rendered":"HOWTO"},"content":{"rendered":"

HOWTO<\/span><\/strong><\/p>\n

#SEARCHING<\/h2>\n

#TRACKING YOUR POSTS<\/h3>\n

There are 2 kinds of control on this platform:<\/p>\n

– Internal<\/p>\n

– External<\/p>\n

#INTERNAL CONTROL<\/h4>\n

It is used for purpuses administration.
\nIt enables to list by author, date, etc.
\nGo to menu, posts.<\/p>\n

 <\/p>\n

#EXTERNAL CONTROL BY SEARCH<\/h4>\n

The external control targets to restore information via token filtering using a “Search” box.<\/p>\n

This is a powerful resource because enables to customize your information organization on your own criteria, grouping, classifying, warning, etc.<\/p>\n

#STANDARDIZED TITLES<\/h5>\n

The posts’ titles on the platform shall follow a convention.<\/p>\n

Syntax<\/h5>\n

CONTEXT: title<\/em><\/p>\n

The context shall belong to one Category.
\nThe category must be defined when the post is created (MANDATORY) otherwise, the post remains “Uncategorized” that must be avoided.<\/p>\n

 <\/p>\n

Example:
\nNode.js: How to Create A Simple Site<\/em><\/p>\n

#STATEMENTS<\/h5>\n

A statement is a string following a convention inserted into the post during its edition as a placeholder or a token for searching purposes.<\/p>\n

A placeholder is a mark to let you know that some action must be taken where the mark marks.
\nExample: TODO, FIXME, XXX<\/p>\n

A placeholder may be one of your own (a customized placeholder).
\nExample: NOT TESTED<\/p>\n

#CUSTOMIZED STATEMENTS<\/h5>\n

A customized statement comes from a convention defined by the post’s author.
\nThe author must be coherent and concise when creating his convention otherwise the reader will not follow.
\nSo a convention must be self-explanatory or at least to no provoke confusion.<\/p>\n

#ANNOTATIONS<\/h5>\n

Annotations are better when following a very well know convention.
\nThis platform adopts Java’s annotations, but the author may create its own taking care to be meaningful avoiding side effects like misunderstandings.<\/p>\n

Example:
\n@Author: ultering.com@gmail.com<\/p>\n

#GROUPING<\/h5>\n

Using statements and annotations you may group, classify and even supply status (warn, error, etc.) through your post collection.
\nWhen proceeding a search by an statement, the return will automatilly group all posts by the filter’s criterium.<\/p>\n

 <\/p>\n

#CATEGORIES<\/h2>\n

The category must be defined when the post is created (MANDATORY) otherwise, the post remains “Uncategorized” that must be avoided.<\/p>\n

A category is a very abstract group, usually the parent of a domain of knowledge.
\nFor example, Ubuntu is context <\/em>and Linux<\/em> is the category.<\/p>\n

You may create category, but take care of the following detail:<\/span><\/p>\n

Never ever create a category that should be a context.<\/strong><\/span><\/p>\n

A category misusage will lead you to be warned by the administrator to fix the error.<\/strong><\/p>\n

<\/h2>\n

#TAGS<\/h2>\n

Tags are used by crawling machines, spiders, etc. created by the Internet’s search engines like Google, Bing, Yahoo, etc.
\nTag is optional, but remember, it may help a your post to be found by a search engine.
\nTags are only available for posts but not for pages.<\/p>\n

 <\/p>\n

 <\/p>\n

#POSTS vs. PAGES DIFFERENCES<\/h2>\n

A page is used for administration purposes like this help.
\nAn author uses posts.<\/p>\n

#DRAFT<\/h3>\n

A post may is created as a draft<\/em> and may be kept as a draft.
\nA draft is not available on the site and this status is useful while you are creating your post.
\nWhe the post is good to go, change its status to publish.<\/p>\n

Check the “Publish” box on the right when editing a post.<\/p>\n

#PRIVATE POSTS<\/h3>\n

A private post is just visible for its author.
\nYou may use this feature to keep personal thing on the site.
\nAt any time you may switch the status to public.<\/p>\n

Check the “Publish” box on the right when editing a post.<\/p>\n

<\/h2>\n

#EDITING POSTS<\/h2>\n

Must know subjects.<\/strong><\/p>\n

It is not allowed other kind of subject that is not about IT (information technology).<\/p>\n

If desired to create a page with personal information, it is necessary to create a private post, checking the following options at the post’s bottom:<\/p>\n

– When editing a post, “Edit Next” is a straight shortcut to edit another post without returning for all posts page.<\/p>\n

#SHORTCUTS<\/h3>\n

#HEADERS<\/h4>\n

To add a <h1> (header level 1) use Shift + Alt + 1.
\nIf h2 use Shift + Alt + 2 and so on up to 6.
\nThere are just 6 levels available.
\nIf required more than this, it is recommended to review the post organization because more lower levels make it less readable.
\nFewer levels are better.<\/p>\n

#IMAGES<\/h4>\n

Point your cursor at the position you desire to insert a new image on the text, then drag and drop the image.
\nUse .jpg or .jpeg instead of .png.
\n.png images have greater sizes than .jpeq (.jpg) images.
\nPlease, save space on server.<\/p>\n

Please, make sure to offer a good name for the image to upload.
\nIf necessary, add reverse date to make it unique.
\nEx.: my_image_200328.<\/p>\n

The good title enables easy search.<\/p>\n

 <\/p>\n

#VISUAL vs. TEXT MODE (HTML)<\/h3>\n

When editing a post or page you have two tabs on the right top to alternate between raw html and the WYSIWYG mode.<\/p>\n

<\/h3>\n

#CODE, SNIPPETS<\/h3>\n

Use code or snippets between <pre>CODE HERE<\/pre> htlm tags.
\nThe platform will format the chunk between pre tags automatically on the view mode (not on the edition mode).
\nExample:<\/p>\n

<pre>\nCODE HERE\n<\/pre>\n<\/pre>\n
There is an internal tool that helps the author on this task  Text To HTML Converter +<\/a><\/strong><\/span><\/p>\n
 <\/p>\n
#IMAGES<\/h3>\n
The platform applies a default format to all images that may be not desired by the author, causing an exceedingly sized image.
\nThis is simple to change. Go to the “Text mode” to edit straight HTML and remove the class=”…” attribute from the HTML <img> tag.
\nExample:<\/p>\n
- BEFORE:\n<img class=\"alignnone size-full wp-image-2286\"<\/span> src=\"https:\/\/ultering.com\/it4us\/wp-content\/uploads\/2020\/03\/wordpress_tags.png\" alt=\"\" width=\"231\" height=\"153\" \/>\n\n- AFTER:\n<img src=\"https:\/\/ultering.com\/it4us\/wp-content\/uploads\/2020\/03\/wordpress_tags.png\" alt=\"\" width=\"231\" height=\"153\" \/>\n<\/pre>\n
<\/h3>\n
#CSS<\/h3>\n
The platform provides buit-in CSS tags for text style customization.<\/p>\n
#<pre> tags<\/h4>\n
default<\/h5>\n
code here\n<\/pre>\n
.programlisting<\/strong><\/h5>\n
used to wrap code\n<\/pre>\n
 <\/p>\n
<pre class=\"programlisting\">&lt;!DOCTYPE html&gt;\n&lt;html lang=\"en\"&gt;\n    &lt;head&gt;\n        &lt;meta charset=\"utf-8\"&gt;\n        &lt;meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\"&gt;\n        &lt;meta name=\"description\" content=\"\"&gt;\n        &lt;meta name=\"author\" content=\"\"&gt;\n        &lt;title&gt;New page&lt;\/title&gt;\n        &lt;link href=\"css\/style.css\" rel=\"stylesheet\"&gt;\n    &lt;\/head&gt;\n    &lt;body style=\"display:grid;grid-template-columns:1fr 1fr;grid-template-rows:100px;\"&gt;&lt;\/body&gt;\n&lt;\/html&gt;\n<\/pre>\n<\/pre>\n
Comes to:<\/p>\n
<!DOCTYPE html>\n<html lang=\"en\">\n    <head>\n        <meta charset=\"utf-8\">\n        <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n        <meta name=\"description\" content=\"\">\n        <meta name=\"author\" content=\"\">\n        <title>New page<\/title>\n        <link href=\"css\/style.css\" rel=\"stylesheet\">\n    <\/head>\n    <body style=\"display:grid;grid-template-columns:1fr 1fr;grid-template-rows:100px;\"><\/body>\n<\/html>\n<\/pre>\n

\n.programlisting2<\/strong><\/h5>\n
used to wrap code\n<\/pre>\n
 <\/p>\n
<pre class=\"programlisting2\">&lt;!DOCTYPE html&gt;\n&lt;html lang=\"en\"&gt;\n    &lt;head&gt;\n        &lt;meta charset=\"utf-8\"&gt;\n        &lt;meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\"&gt;\n        &lt;meta name=\"description\" content=\"\"&gt;\n        &lt;meta name=\"author\" content=\"\"&gt;\n        &lt;title&gt;New page&lt;\/title&gt;\n        &lt;link href=\"css\/style.css\" rel=\"stylesheet\"&gt;\n    &lt;\/head&gt;\n    &lt;body style=\"display:grid;grid-template-columns:1fr 1fr;grid-template-rows:100px;\"&gt;&lt;\/body&gt;\n&lt;\/html&gt;\n<\/pre>\n<\/pre>\n
Comes to:<\/p>\n
<!DOCTYPE html>\n<html lang=\"en\">\n    <head>\n        <meta charset=\"utf-8\">\n        <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n        <meta name=\"description\" content=\"\">\n        <meta name=\"author\" content=\"\">\n        <title>New page<\/title>\n        <link href=\"css\/style.css\" rel=\"stylesheet\">\n    <\/head>\n    <body style=\"display:grid;grid-template-columns:1fr 1fr;grid-template-rows:100px;\"><\/body>\n<\/html>\n<\/pre>\n
.programlisting3<\/strong><\/h5>\n
<div class=\"programlisting3\">\nHello!\nUsing programlisting3\n<\/div>\n\n<\/pre>\n
Comes to:<\/p>\n
Hello!\nUsing programlisting3\n<\/pre>\n
 <\/p>\n
 <\/p>\n
.programboxing<\/strong><\/p>\n
alternative to wrap code inside programlisting.\n<\/pre>\n
 <\/p>\n
<pre class=\"programboxing\">&lt;!DOCTYPE html&gt;\n&lt;html lang=\"en\"&gt;\n    &lt;head&gt;\n        &lt;meta charset=\"utf-8\"&gt;\n        &lt;meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\"&gt;\n        &lt;meta name=\"description\" content=\"\"&gt;\n        &lt;meta name=\"author\" content=\"\"&gt;\n        &lt;title&gt;New page&lt;\/title&gt;\n        &lt;link href=\"css\/style.css\" rel=\"stylesheet\"&gt;\n    &lt;\/head&gt;\n    &lt;body style=\"display:grid;grid-template-columns:1fr 1fr;grid-template-rows:100px;\"&gt;&lt;\/body&gt;\n&lt;\/html&gt;\n<\/pre>\n<\/pre>\n
Comes to:<\/p>\n
<!DOCTYPE html>\n<html lang=\"en\">\n    <head>\n        <meta charset=\"utf-8\">\n        <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n        <meta name=\"description\" content=\"\">\n        <meta name=\"author\" content=\"\">\n        <title>New page<\/title>\n        <link href=\"css\/style.css\" rel=\"stylesheet\">\n    <\/head>\n    <body style=\"display:grid;grid-template-columns:1fr 1fr;grid-template-rows:100px;\"><\/body>\n<\/html>\n<\/pre>\n

\n.wrongprogramlisting<\/strong><\/h5>\n
used to wrap wrong code or not useful\n<\/pre>\n
.output<\/h5>\n
Output:<\/p>\n
<!DOCTYPE html>\n<html lang=\"en\">\n    <head>\n        <meta charset=\"utf-8\">\n        <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n        <meta name=\"description\" content=\"\">\n        <meta name=\"author\" content=\"\">\n        <title>New page<\/title>\n        <link href=\"css\/style.css\" rel=\"stylesheet\">\n    <\/head>\n    <body style=\"display:grid;grid-template-columns:1fr 1fr;grid-template-rows:100px;\"><\/body>\n<\/html>\n<\/pre>\n
.outputlisting:<\/h5>\n
Used to wrap code from an external output (for instance from prompt, pgms, etc).<\/p>\n
Output:<\/p>\n
<!DOCTYPE html>\n<html lang=\"en\">\n    <head>\n        <meta charset=\"utf-8\">\n        <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n        <meta name=\"description\" content=\"\">\n        <meta name=\"author\" content=\"\">\n        <title>New page<\/title>\n        <link href=\"css\/style.css\" rel=\"stylesheet\">\n    <\/head>\n    <body style=\"display:grid;grid-template-columns:1fr 1fr;grid-template-rows:100px;\"><\/body>\n<\/html>\n<\/pre>\n
#<div> , <span> , <code><\/h4>\n
The same CSS classes used for <pre> tag may be used to another tag.
\nUsing <div> or <span> scapes the default format that overwrites the classes.<\/p>\n
.outputlisting2<\/h5>\n
That way, some CSS classes may not work well with when used with <pre> tag.
\nThis is the case of .outputlisting2 <\/em>class that shall be used with<\/p>\n
Examples:<\/p>\n
#Using <div> tag<\/h6>\n
<div class=’outputlisting2′>
\noutputlisting2 is not useful with <pre> tag
\n<\/div><\/div>\n
#Using <span> tag<\/h6>\n
<span class=’outputlisting2′>
\noutputlisting2 is not useful with <pre&gt; tag
\n<\/span><\/span><\/p>\n
#Using <code> tag<\/h6>\n
<code class='outputlisting2'>
\noutputlisting2 is not useful with <pre> tag
\n<\/code><\/code>
\n<\/p>
 <\/div>\n
 <\/p>\n
There is an internal tool that helps the author on this task  Text To HTML Converter +<\/a><\/strong><\/span><\/p>\n
<\/h3>\n
#CUSTOM CSS<\/h4>\n
The author may create his own CSS classes.
\nGo to the “Custom CSS<\/em>” box and set your CSS code in it.<\/p>\n
Follow the example:<\/p>\n
 <\/p>\n
<div class=”my_style”>
\nhello world!
\n<\/div><\/div>\n

\n<span class=”my_style”>
\nhello world!
\n<\/span>
\n<\/span>
\n<\/p>
 <\/div>\n
#BOOTSTRAP<\/h3>\n
It is possible to work with bootstrap.<\/p>\n
Example:<\/p>\n
<div class=\"container\">\n    <div class=\"row\">\n        <div class=\"col-md-4\">md4<\/div>\n        <div class=\"col-md-4\">md4<\/div>\n        <div class=\"col-md-4\">md4<\/div>\n    <\/div>\n        <div class=\"row\">\n        <div class=\"col-md-8\">md8<\/div>\n        <div class=\"col-md-2\">md2<\/div>\n        <div class=\"col-md-2\">md2<\/div>\n    <\/div>\n<\/div>\n<\/pre>\n
 <\/p>\n
Resultado<\/strong><\/p>\n
 <\/div>\n
<\/h3>\n
#TEMPLATES<\/h2>\n
There are some templates available<\/a> to be used as models for page design using bootstrap, CSS.
\nCopy its code and paste to your page.<\/p>\n
SEE   Templates<\/a><\/strong><\/span><\/p>\n
 <\/p>\n
#SHORTCODES<\/h3>\n
Shortcodes are a very powerful feature that enable to add a chunk of code using simple instruction.
\nShortcodes are defined between square brackets.<\/p>\n
Syntax:<\/strong>
\n\n<\/p>
#AVAILABLE SHORTCUTS<\/h4>\n
#SPACING – FORCING TOP MARGIN<\/h5>\n
NOTE: to use, remove the dots.<\/strong><\/p>\n
#[.sc name=”sep15″.]<\/h6>\n
Inserts a top margin of 15px.<\/p>\n
#[.sc name=”sep30″.]<\/h6>\n
Inserts a top margin of 30px.<\/p>\n
#[.sc name=”sep50″.]<\/h6>\n
Inserts a top margin of 50px.<\/p>\n
 <\/p>\n
#SECURITY<\/h2>\n
#RESET PASSWORD<\/h3>\n
There are two ways – internal and external access.<\/p>\n
1. Go to the menu, profile.
\nor
\n2. Go to home page, login, “Lost your password?” link.
\n
<\/h2>\n
#PASSWORD \/ #PERSONAL INFORMATION<\/h3>\n
Go to the menu, profile.
\nF’ollow by the image below.<\/p>\n
 <\/p>\n
#TOOLS<\/h2>\n
Some small tools are available at TOOLS<\/a><\/p>\n
 <\/p>\n
#Text To HTML Converter +<\/a><\/h3>\n
@FROM: lab – draft project N. rin544d<\/p>\n
#setup<\/h4>\n
Go to:
\nMenu, Shortcoder, text2htmlPlus, text2html.html
\nhttps:\/\/ultering.com\/it4us\/wp-admin\/edit.php?post_type=shortcoder<\/p>\n
Working straight on Shortcoder I got malfuncion, then work outside and just copy to Shortcoder taking care of including just script code plus html code between <body> without including the <body> tags itself.
\n@SEE: wordpress***maint:
\nhttps:\/\/ultering.com\/itstuff\/?p=17036<\/p>\n
Backup:
\nM:\\work\\devcli_\\javascript\\conversions\\text2html.html<\/p>\n
 <\/p>\n\n
<\/div>","protected":false},"excerpt":{"rendered":"
HOWTO #SEARCHING #TRACKING YOUR POSTS There are 2 kinds of control on this platform: – Internal – External #INTERNAL CONTROL It is used for purpuses administration. It enables to list by author, date, etc. Go to menu, posts.   #EXTERNAL CONTROL BY SEARCH The external control targets to restore information via token filtering using a … Read More “HOWTO”<\/span> »<\/a><\/p>\n","protected":false},"author":4,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_bbp_topic_count":0,"_bbp_reply_count":0,"_bbp_total_topic_count":0,"_bbp_total_reply_count":0,"_bbp_voice_count":0,"_bbp_anonymous_reply_count":0,"_bbp_topic_count_hidden":0,"_bbp_reply_count_hidden":0,"_bbp_forum_subforum_count":0,"footnotes":""},"class_list":["post-2191","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/ultering.com\/it4us\/index.php?rest_route=\/wp\/v2\/pages\/2191","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ultering.com\/it4us\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/ultering.com\/it4us\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/ultering.com\/it4us\/index.php?rest_route=\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/ultering.com\/it4us\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=2191"}],"version-history":[{"count":6,"href":"https:\/\/ultering.com\/it4us\/index.php?rest_route=\/wp\/v2\/pages\/2191\/revisions"}],"predecessor-version":[{"id":5386,"href":"https:\/\/ultering.com\/it4us\/index.php?rest_route=\/wp\/v2\/pages\/2191\/revisions\/5386"}],"wp:attachment":[{"href":"https:\/\/ultering.com\/it4us\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=2191"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}