TextView HTML & CSS Tutorial with JavaScript Text ID Block Specs

TextView is an element of HTML section in JavaScript Block Editor app. It shows some texts to readers. It is the most used element in blog websites.

This post is also made with JavaScript Block Editor app and we used TextView element in this project!

Download the app from here: click it ⬇.

Documentation

HTML TextView Block Spec

Click on TextView to add a TextView to the specific line.

Properties:

TextView Id: Required if you want to use CSS and JavaScript Text ID block specs.

Text: Displayable text to readers.

CSS: To implement style.

On Click: When somebody clicks on it, this event will happen. Write script name here. For example: tv1clicked() or tv3c() etc.

On Touch: When somebody touches on it, this event will happen. Write script name here. For example: tv1touched() or tv3t() etc.

* If you use events (OnClick/OnTouch), handle event(s) in JavaScript Editor.

CSS for TextView

padding: Default padding value is 2. If you want to set padding value(s) for TextView, remove the default value 2. Then the position will appear such as— top, bottom, left, right. Set your own value(s).

background-colour: Click on rgb. Then Colour Picker will appear. Adjust colour schemes and then save.

background image url: Paste here the download url of your expected image. Otherwise keep this empty.

opacity: It is the alpha property of element(s). It creates fog on element(s). Default value is 1. Value range is 0.1—1.

text colour : Click on rgb. Then Colour Picker will appear. Adjust colour schemes and then save.

deco: Default value is 'none'. You can use underline, overline or line-through value.

case: By default, its value is 'none'. You can use UPPER or lower case!

font size: Enter integer number. For using default value, keep this empty.

unsupported properties: width, height, margin, rotate, scale(X&Y), translation(X&Y), align — these properties are not supported for the element TextView.

Click the arrow ➤ to save your change(s).

JavaScript Text ID block specs

➤ Text Id [] Set Text []
Text Id: Enter the Id of the TextView you expect.
Quoted
Set Text: Write the text here. Otherwise enter the variable name which bears the text.
If it is not a variable
Quoted
If it is a variable
Quoted 

➤ Var [] = Get Text, Text Id []
Var: Enter the variable name where you want to store the text from a TextView.
Quoted
= Get Text, Text Id: Enter the id of the TextView from which you want to collect text.
Quoted 

➤ Text Id [] Set TypeFace []
Text Id: Enter the Id of the TextView you expect.
Quoted
Set TypeFace: Write the font name here.
Quoted
List of font names:

• Arial


• Times New Roman


• Georgia


• Courier New


• Helvetica, sans-serif


• Verdana, sans-serif


• Garamond, serif


• Tahoma, sans-serif


• Trebuchet MS, sans-serif


• Brush Script MT, cursive

➤ Text Id [] Set Colour []
Text Id: Enter the Id of the TextView you expect.
Quoted
Set Colour: Colour Picker will appear. Adjust colour schemes and then save.

➤ Text Id [] Set Text Size []
Text Id: Enter the Id of the TextView you expect. 

Set Text Size: Set an integer number.
Quoted

Watch the video tutorial ↓