Thursday, 1 June 2017

How to Write an HTML Page | How to use HTML | Make a HTML page

Four Parts:     Setting Up a Document    Formatting Text    Adding Links and Images    Learning More and Putting Your Page Online

HTML (HyperText Markup Language) is a basic language for developing web-pages. It was created to be an easy and flexible coding language. Just about every page on the Internet was developed with some form of this code (ColdFusion, XML, XSLT). HTML is easy to pick up, but can keep you learning for a long time if you're interested in its complete functions. To add more color and excitement to your web pages, you can learn basic CSS as soon as you're comfortable with a basic HTML page.

Part 1 of 4: Setting Up a Document

How to Write an HTML Page | How to use HTML | Make a HTML page




1.) Open a simple text editor.

NotePad is a good option that can be downloaded for free. You can write HTML with most text editing software, but more complex software with automatic formatting can make it harder to organize your HTML page.
  • TextEdit is not recommended, as it will often save the file in a format your browser may not recognize as HTML.
  • You can also use an online HTML editor. Specialized HTML editing programs are not recommended for beginners.
How to Write an HTML Page | How to use HTML | Make a HTML page



2.) Save a file as a web page.

Select FileSave As in the top menu. Change the file format to "Web Page," ".html" or ".htm". Save it in a location where you can easily find the file.
  • There is no difference between these three options.

How to Write an HTML Page | How to use HTML | Make a HTML page



3.) Open the file in a web browser.

Double click the file, and it should automatically open as a blank web page in your browser. Alternatively, you can open a browser, such as Firefox or Internet Explorer, and use FileOpen File to select the document.
  • This web page is not online. It can only be viewed on your computer.


How to Write an HTML Page | How to use HTML | Make a HTML page


4.) Refresh the web page to see saved changes.

Type this into your blank document: <strong>Hello</strong>. Save the document. Refresh the blank web page in your browser, and you should see the word "Hello" appear at the top of the page in bold. Anytime you want to test your new HTML during this tutorial, save the .html document, then refresh your browser window to see how the HTML is interpreted.
  • If you see the words "<strong>" and "</strong>'' appear in your browser, your file isn't being properly interpreted as HTML. Try a different text editing program or a different browser.


How to Write an HTML Page | How to use HTML | Make a HTML page


5.) Understand tags.

HTML instructions are written in "tags" that tell the browser how to interpret and display your web page. They are always written between angle brackets <like these>, and are not displayed on the web page. You've already used them in the example above:
  • <strong> is a "start tag" or "opening tag". Anything written after this tag will be defined as "strong text" (usually indicated in bold on a web page).
  • </strong> is an "end tag" or "closing tag," which you can identify from the / symbol. This shows where the strong text stops. Most tags (though not all) need an end tag to function, so remember to include it.
How to Write an HTML Page | How to use HTML | Make a HTML page



6.) Set up your document.

Delete everything in your HTML document. Begin again with the following text, exactly as written (ignoring the bullet points). This HTML code tells the browser what type of HTML you'll be using, and that all your HTML will be contained within the <html> and </html> tags.
  • <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  • <html>
  • </html>


How to Write an HTML Page | How to use HTML | Make a HTML page


7.) Add head and body tags.

HTML documents are divided into two sections. The "head" section is for special information, like the title of the page. The "body" section includes the main content of the page. Add these both to your document, remembering to include end tags. The new text to add is in bold:
  • <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  • <html>
  • <head>
  • </head>
  • <body>
  • </body>
  • </html>


How to Write an HTML Page | How to use HTML | Make a HTML page


8.) Title your page.

Most tags that go in the head section are not important to learn as a beginner. The title tag is easy to use, though, and will determine what shows up as the name of your browser window or on the browser tab. Put the title start and end tags inside the head tags, and write any title you like between them:
  • <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  • <html>
  • <head>
  • <title>My first HTML page.</title>
  • </head>
  • <body>
  • </body>
  • </html>


Part 2 of 4: Formatting Text

How to Write an HTML Page | How to use HTML | Make a HTML page




1.) Add some text to your body section.

For this section, we'll be working only within the body tags. The other text will still be there in your document, but we'll save some space by not repeating it every time in this guide. Write anything you like between the <body> and </body> tags, and it will appear as the first content on your web page. For example:
  • <body>
  • I'm following the Way2trick  guide to write an HTML page.
  • </body>
How to Write an HTML Page | How to use HTML | Make a HTML page



2.) Add headers to your text.

Organize your page with header tags, which instruct the browser to display text between them in a larger size. These are also used by search engine bots and other tools to determine what your page is about and how it is organized. <h1> </h1> is the largest header, and you can create smaller headers all the way down to <h6> </h6>. Try them out on your page:
  • <body>
  • <h1>Welcome to My Web Page.</h1>
  • I'm following the Way2trick guide to write an HTML page.
  • <h3>My goals today:</h3>
  • <h5>Completed goals:</h5>
  • Learn how to use headers.
  • <h5>Uncompleted goals:</h5>
  • Learn more text formatting tags.
  • </body>
How to Write an HTML Page | How to use HTML | Make a HTML page




3.) Learn more text formatting tags.

You've already seen the "strong" tag, but there are many more ways to format your text. Play around with these, or with multiple tags around the same string of text. Always remember to add the end tag afterward!
  • <strong>Important text, displayed as bold in browsers.</strong>
  • <em>Emphasized text, displayed as italics in browsers.</em>
  • <small>Slightly smaller text than usual. This automatically scales if used in a heading. </small>
  • <del>Text that is no longer applicable, displayed with a strike-through line.</del>
  • <ins>Text that has been inserted later than the rest, displayed as an underline.</ins>
How to Write an HTML Page | How to use HTML | Make a HTML page



4.) Arrange your text on the page.

You might have noticed that hitting the "enter" key isn't enough to get your text to display on a different line. These tags can help you form paragraphs and line breaks, or arrange your text in other ways:
  • <p> Short for "paragraph," this will keep all text between these tags in one paragraph, and separate it out from text above and below it.</p>
  • <br> This will create a line break. Do not include an end tag for this, since it's not altering any other content. Use this for poems or address lines, not to separate paragraphs.
  • <pre>If you need to display text very precisely, this tag will set the text inside to a fixed-width font (each letter exactly the same width), and let you create spaces and line breaks as you would for normal typing instead of with tags.</pre>
  • <blockquote>This defines text that has been quoted from a source.</blockquote> You can describe the source afterward with the <cite>cite tag</cite>.
How to Write an HTML Page | How to use HTML | Make a HTML page



5.) Add invisible comment text.

Comment tags are not visible on the web page. They allow you to write notes to yourself in the HTML document, without interfering with the content. <!--- Write your comment inside the tag. ---> Do not add an end tag.
  • Tags that stand by themselves and do not use end tags are called "empty tags."


How to Write an HTML Page | How to use HTML | Make a HTML page


6.) Put it all together.

The best way to remember these tags is to use them in your own web page. Here's an example using tags from each of the steps you've learned so far. Try to predict what it would look like in a browser, than copy-paste it to your document and find out.
  • <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  • <html>
  • <head>
  • <title>My first HTML page.</title>
  • </head>
  • <body>
  • <h1>Welcome to My Web Page.</h1>
  • I hope you enjoy the site!<p><strong>I made it just for you.</strong>
  • <h2>Part One: How I Discovered HTML</h2>
  • <!---Note to self: remember that "h1" is a larger header than "h2"--->
  • I've been learning HTML for <del>one</del> <ins>two</ins>hours now, so I'm an expert.
  • </body>
  • </html>

Part 3 of 4: Adding Links and Images



How to Write an HTML Page | How to use HTML | Make a HTML page


 1.) Learn about attributes.

Tags can have extra information written inside them, called "attributes." These show up as extra words within the tag itself, in the form of attribute-name="specific value". For example, just about any HTML tag can have the title attribute:
  • <p title="Introduction">Introductory paragraph goes here.</p> gives the paragraph a title, "Introduction," which appears when you mouse over the paragraph in the web page.


How to Write an HTML Page | How to use HTML | Make a HTML page


2.) Link to another web page.

Use the <a> </a> tag to create a hyperlink to any other web page. Insert the URL of the web page to link to using the href attribute. Here's an example that links to the page you're reading now:

<a href=" http://way2trick.blogspot.com/2015/11/how-to-write-html-page.html
">Visitors to your website can click this text to follow the link.</a>

How to Write an HTML Page | How to use HTML | Make a HTML page


3.) Add an id attribute to tags.

Another attribute that just about any HTML tag can use is the "id" element. Inside any tag, write id="example" or use any name that does not include spaces.This won't have any visible effect, but we'll use it in the next step.
  • For example, add this to your document: <p id="example">This paragraph will be used as an example to show how the id attribute works.</p>


How to Write an HTML Page | How to use HTML | Make a HTML page


4.) Link to an element with a certain id.

Now we can use the hyperlink tag, <a> </a>, to link to another spot on the same page. Instead of a URL, we'll use the # symbol, followed by the id value we're linking to. For example, <a href="#example">This text will link to the paragraph with the id "example."</a>
  • All HTML values are case-insensitive. "#EXAMPLE" and "#example" will link to the same place.
  • If your page is short enough to display all at once, you might not notice anything happen when you click the link in your browser. Resize the window until a scroll bar appears, then try again.

How to Write an HTML Page | How to use HTML | Make a HTML page


5.) Add an image.

The <img> tag is an empty tag, meaning no closing tag is necessary. All the information the browser needs to display the image will be added using attributes. Here's an example that will display the Way2trick logo, followed by a description of each attribute:
  • <img src="http://pad2.whstatic.com/skins/owl/images/Way2trick_logo.png" style="width:324px;height:84px" alt="Way2trick. logo">
  • The src=" " attribute tells the browser where to find the image. (Note that it's generally considered rude to display an image from someone else's site – and the image will disappear if that site ever goes offline.)
  • The style=" " attribute can do many things, but most importantly it's used to set the width and height of the image in pixels. (You can instead use the separate width=" " and height=" " attributes, but this can lead to weird resizing problems if you are using CSS.)
  • The alt=" " attribute is a brief description of the image, which the user will see if the image fails to load. This is considered a requirement, since it's used by screen readers for blind visitors.

Part 4 of 4: Learning More and Putting Your Page Online


How to Write an HTML Page | How to use HTML | Make a HTML page


1.) Validate your HTML.

HTML validation checks for errors in your code. If your web page isn't displaying correctly, validation can help you find the mistake causing problems. It can also teach you more about HTML, by identifying code that looks fine on your display, but isn't recommended due to updates in the HTML standard. Using invalid HTML doesn't make your site unusable, but it can cause problems or inconsistent display in different browsers.
  • Try a free online validation service from W3C or search for another HTML 5 validator online.


How to Write an HTML Page | How to use HTML | Make a HTML page


2.) Learn more tags and attributes.

There are many more HTML tags and attributes, and many places to learn them:
  • Try w3schools and HTML Dog for more tutorials and comprehensive lists of tags.
  • Find a web page you like the look of, and use your browser's "View Page Source" function to see the HTML for yourself. Copy-paste it into your own document and play with it to see how it works.
How to Write an HTML Page | How to use HTML | Make a HTML page


3.) Put your web page online.

Choose a web hosting service, and you can upload as many HTML pages as you like to your personal web domain. To do this, you'll need to use FTP uploading software, but many web hosts provide this service as well.
  • When linking to pages or images on your own site, you do not need to use the full address. For example, if your domain name is www.superskilledhtmlcoder.com, then <a href="/journal/monday.html">the text inside these tags</a> will link to the address "www.superskilledhtmlcoder.com/journal/monday.html"

How to Write an HTML Page | How to use HTML | Make a HTML page


4.) Add style with CSS.

If your HTML page is looking a little bare-bones, try learning some basic CSS to add color, different fonts, and greater control over element placement. Linking a CSS "stylesheet" to the HTML page lets you make powerful changes quickly, automatically adjusting the style of all text within a certain tag. You can play around with a basic stylesheet here, or delve into a more detailed tutorial at HTML Dog's CSS guide.

How to Write an HTML Page | How to use HTML | Make a HTML page


5.) Add JavaScript to your page.

JavaScript is a programming language used to add more function to your HTML pages. JavaScript commands are inserted between the start and end tags <script> </script>, and can be used to add interactive buttons, calculate math problems, and much more. Learn more from the w3c examples.


Tips:-

  • The doctype used in this tutorial is "loose HTML 4.0.1 transitional", an easy format for beginners to use.  Use (<!DOCTYPE html>) instead for the browser to interpret it as strict HTML 5 formatting, which is the recommended (though less commonly used) standard.

Warnings:-

  • HTML is intended to hold content in a universal format. It is not meant to control the presentation of your web page, such as the background color and precise placement of elements. While there are tags that let you control these things, using CSS is highly recommended to create a more controllable, consistent web page.

Things You'll Need:-

A simple text editor, such as NotePad or TextEdit
A web browser, such as Internet Explorer or Mozilla Firefox
(Optional) An HTML editor such as Adobe Dreamweaver, Aptana Studio, or Microsoft Expression Web

How to Learn HTML | HTML online learning | How to use HTML

Two Parts:   Learning Basic HTML    Learning More Advanced HTML

HTML is the abbreviation for Hyper Text Markup Language, and is the code, or language that is used for the creation of websites. It can look a little daunting if you've never done any coding before, but all you need to try it out is an ordinary text editing application and an internet browser. You might even recognize some HTML used to change text in online forums, customized online profiles, or Way2trick articles. HTML is a useful tool for anyone who uses the internet, and learning the basics may take you less time than you think.

Part 1 of 2: Learning Basic HTML


How to Learn HTML | HTML online learning | How to use HTML


1.) Open an HTML document.

Most text editing programs, including Notepad or Microsoft Word for Windows and TextEdit for Mac, can be used to write HTML documents. Open a new document and use FileSave As in the top menu to save it as a "Web Page," or to change the file extension to ".html" or ".htm" instead of ".doc," ".rtf," or any other extension.
  • You may see a warning that your document will be changed to "plain text" instead of "rich text," or that special formatting and images won't be saved properly. This is fine; HTML documents do not use those options.
  • There is no difference between .html and .htm files. Either will work.


How to Learn HTML | HTML online learning | How to use HTML


2.) View your document with an internet browser.

Save your blank document, then find the document icon in your computer and double click to open it. It should open as a blank web page in your browser. If it doesn't, drag the file icon to the URL (address) bar of your browser. As you edit your HTML document in this tutorial, you can keep checking back and seeing how your web page changes.
  • Note that this does not actually create a website online. It will not be accessible by other people, and you do not need an internet connection to test out. This just uses a browser to "read" your HTML document as though it were a website.

How to Learn HTML | HTML online learning | How to use HTML


3.) Understand markup tags.

Markup tags do not show up on a web page like normal text. Instead, they tell your web browser how to display the page and its content. The "start tag" contains instructions. For example, it might tell the browser to display text as bold. You also need an "end tag" to let the browser know where the instructions apply: in this example, all text between the start tag and the end tag will be bold. Write end tags inside angle brackets as well, but start with a slash after the first bracket.
  • Write start tags in between angle brackets: <start tag goes here>
  • Write end tags in between angle brackets, but put a slash after the first bracket: </end tag goes here>)
  • Keep reading to learn how to write functional markup tags. For this step, all you need to remember is the basic format they are written in: < > and </ >
  • If you are using other HTML tutorials as well, you might see them refer to the tags as "elements" and the text in between start and end tags as "element content."


How to Learn HTML | HTML online learning | How to use HTML


4.) Write you first <html> tag.

Every html document starts with a <html> tag and ends with a </html> tag. This tells the browser that everything between these tags is in HTML. Add these tags to your document:
  • Write <html> at the top of your document.
  • Hit enter or return several times to give yourself some space, then write </html>
  • Remember to write everything else in this tutorial in between these two tags.


How to Learn HTML | HTML online learning | How to use HTML


5.) Fill out the <head> portion of your document.

In between the <html> and </html> tags, write a <head> start tag and a </head> end tag. Give yourself space to write between them. Everything in between these head tags won't actually be displayed on the page itself. Try the following and see where it shows up instead:
  • In between the <head> and </head> tags, write <title> and </title>
  • In between the <title> and </title> tags, write How to Learn HTML .
  • Save the document and open it in a browser (or save the document, then refresh the browser page if it's already open.) Do you see what you wrote at the top of the browser, above the address bar?


How to Learn HTML | HTML online learning | How to use HTML


6.) Create a <body> section.

Everything else in this beginner document will go in a body section, which actually gets displayed on the web page. After the </head> end tag, but before the </html> tag, write <body> and </body>. For the rest of this tutorial, everything your write will go in between these body tags. You should now have a document that looks like this (ignoring the bullet points):
  • <html>
  • <head>
  • <title>How to Learn HTML </title>
  • </head>
  • <body>
  • </body>
  • </html>

How to Learn HTML | HTML online learning | How to use HTML


7.) Add text in various styles.

Now it's time to write something you can actually see in your browser! Anything you write within the body tags will show up in your browser after you save the HTML document and refresh the browser page. Don't write anything with the < or > symbols, however, since your browser will try to interpret it as an HTML instruction instead of normal text. Try writing Hello world! (or anything else you like), then add these new tags around it and see what happens each time:
  • <em>Hello world!</em> will show up as "emphasized text:" Hello world!
  • <strong>Hello world!</strong> will show up as "strong text:" Hello world!
  • <s>Hello world!</s> will show up with a strikethrough: Hello world!
  • <sup>Hello world!</sup> will show up as superscript: Hello world!
  • <sub>Hello world!</sub> will show up as subscript: Hello world!
  • Try combinations of these: What does <em><strong>Hello world!</strong></em> look like?

How to Learn HTML | HTML online learning | How to use HTML


8.) Divide your text into paragraphs.

If you try to write several lines of text in your HTML document, you might notice that the line breaks don't show up in your browser. You have to code these in yourself:
  • <p>This is a separate paragraph.</p>
  • This sentence is followed by a line break.<br>before this sentence begins.
    This is the first tag you've seen that doesn't need an end tag! These are called "empty tags."
  • Make headings to display the names of sections:
    <h1>header text</h1>: the largest header
    <h2>header text</h2> (the 2nd level header)
    <h3>header text</h3> (the 3rd level header)
    <h4>header text</h4> (the 4th level header)
    <h5>header text</h5> (the smallest header)


How to Learn HTML | HTML online learning | How to use HTML


9.) Learn how to make lists.

There are several different ways to write lists on your webpage. Try out the following types of code and see which one you like. Note that one pair of tags goes around the whole list (such as the <ul> and </ul> tags for "unordered list"), while individual items on the list are surrounded by another pair of tags, such as <li>and</li>.
  • Use this code to make bulleted lists:
    <ul><li>One item</li><li>Another item</li><li>Another item</li></ul>
  • Or this code to make numbered lists:
    <ol><li>Item 1</li><li>Item 2</li><li>Item 3</li></ol>
  • Or this code to make a list defining terms:
    <dl><dt>Coffee</dt><dd>- Hot Beverage</dd><dt>Leite</dt><dd>- Cold Beverage</dd></dl>


How to Learn HTML | HTML online learning | How to use HTML


10.) Spruce up your page with line breaks, horizontal lines, and images.

Now it's time to try adding things besides text to your page. Try out the following tags, or click the links for more information. You'll need to use an online image hosting service so you have a URL to link to in the image tag:
  • Insert a Line in HTML: <br> or <hr>
  • Add images: <img src="your_image_url">


How to Learn HTML | HTML online learning | How to use HTML


11.) Link to other places on the page.

You can also use this code to link to other pages and websites, but for now, since you may not have a web site yet, we'll focus on "anchors," or specific places on the page that you can link to:
  • First make an anchor with the <a> tag at the point on the page that you want to link to. Name it something descriptive and easy to remember.:<a name="Tips">This is the text you put the anchor around.</a>
  • Use the <href> to link to those anchors or to another webpage:<a href="url of webpage, or name of anchor within this page">Write the text or image that will be displayed as a link here.</a>
  • To link to an anchor on a different web page, add the # sign after the URL, followed by the name of the anchor.

Part 2 of 2: Learning More Advanced HTML

How to Learn HTML | HTML online learning | How to use HTML



1.) Learn about attributes.

Attributes are placed within the tag itself, making additional alterations to the "element content" between the start and end tag. They never stand alone. They are written in the format name="value", where name is the name of the attribute (for instance "color"), and value describes this specific instance (for instance "red").
  • You've actually seen attributes before, if you followed the tutorial in the basic HTML section. <img> tags use the src attribute, anchors use the name attribute, and links use the href attribute. See how those all follow the ___="___" format?


How to Learn HTML | HTML online learning | How to use HTML


2.) Experiment with HTML tables.

Making a table, or chart, requires several different tags. Play with these tags, or learn about HTML tables in more detail.
  • Start with table tags around the entire table:<table></table>
  • Row tags around the contents of each row: <tr>
  • Column headers in the first row: <th>
  • Cells in subsequent rows: <td>
  • Here's an example of how it all fits together:<table><tr><th>Column 1: Month</th><th>Column 2: Money Saved</th></tr><tr><td>January</td><td>$100</td></tr></table>

How to Learn HTML | HTML online learning | How to use HTML


3.) Learn the miscellaneous head tags.

You've already learned the <head> tag, which shows up at the start of each document. Besides the <title> tag, it can include the following types of tags:
  • Meta tags, which are used to provide metadata about a web page. This data can be used by search engines when the robot scours the internet to locate and list websites. To make your website more visible on search engines, use one or more <meta> start tags (no end tags necessary), each with exactly one name attribute and one content attribute, for example: <meta name="description" content="write a description here">; or <meta name="keywords" content="write a list of keywords, each separated by a comma">
  • <link> tags are used to associate other files with the page. This is mainly used to link to CSS stylesheets, which are made using a different type of coding to alter your HTML page by adding color, aligning your text, and many other things.
  • <script> tags are used to link the page to JavaScript files, which can cause the page to change as the user interacts with it.


How to Learn HTML | HTML online learning | How to use HTML


4.) Play around with HTML found on websites.

A great way to expand your knowledge is by looking into the HTML source of webpages. You can do this by right clicking the page and selecting "View Source," "View Page Source," or a similar option, or by going to the View section in the top menu of your browser. Try to figure out what each unfamiliar HTML tag does, or look it up online for the answer.
  • While you cannot edit other people's web sites, you can copy the HTML you find into your own document, then play with it to see what different options do. Note that, without the CSS stylesheet that website links to, you may not be able to see all of the colors or formatting.

How to Learn HTML | HTML online learning | How to use HTML


5.) Learn more advanced web design from comprehensive guides.

There are various resources on the internet that you can use to learn about many more HTML tags, such as W3Schools or Codecademy. You may also find books with tutorials about HTML, but make sure you use one that was published within the last couple years, since there are occasional updates and changes. Better yet, learn CSS to have much more control over your web page's layout and appearance. Once you have CSS down, the next step for web designers is typically Javascript.


Tips:-

  • You might like to try finding a simple webpage on the Internet, and playing around with the code. Try moving some text, changing the font, altering images, anything that takes your fancy!
  • You could get a notebook and write all the codes down, so that if you need reminding, you can just open your notebook and see. You could also print this page out as a helpful point of reference.
  • XML and RSS are becoming more and more common on websites these days. Their code may seem tough to read and understand to the human observer, especially when viewed on a HTML source code file, but they have their own effects to them.
  • Notepad++ is an excellent, free program, which acts like a regular notepad, but you can save and test your code live in a browser. ((It also allows almost any coding language. HTML, CSS, python, Javascript, etc. ))
  • The markup tags themselves in HTML are not case sensitive, but using all lower case (as used on this page) is highly recommended for standardization purposes and for compatibility with XHTML.
  • When coding, make sure you lay your code out neatly, so that it is possible for you and others to understand it. Use <!-- Insert comment here --> for HTML comments, which don't show up in the webpage, but do in the code.

Warnings:-

  • Some tags have become deprecated over the last few years, and have been replaced with other options to produce the same effects, and even add different effects, if you so desire.
  • If you are interested in validating your pages, go to the W3 website and learn valid HTML! HTML standards change over time, and some tags are replaced by different tags that work better on modern browsers.

How to Add Twitter to your Website or Blog

Twitter is a useful tool for both businesses and professionals. Unlike traditional blogging, Twitter only allows posts, called "tweets," of up to 140 characters or less. Many of Twitter's 300 million users tweet with smartphones as well as on the computer. 

How to Add Twitter to your Website or Blog

If you would like to use Twitter as a way to update your blog readers or website fan base, then a badge can be added. Although many websites have a built in Twitter option, Twitter.com has also created a Twitter badge that can be posted in your website's HTML web coding. This article will tell you how to add Twitter to your website or blog.

Steps :- 


1.) Ask a web developer or IT person to help you with this process, if you do not know how your website works.

For most situations, you will need to have some knowledge of HTML code to properly place a Twitter box on your site or blog.




2.) Log into your website or blog admin page.

Before automatically using Twitter's own badge, you should check to see if your website template already includes a Twitter option. Many websites, such as WordPress, have a Twitter widget included in the administrative dashboard options.
  • If you are using WordPress for a website or blog, you should go to your dashboard and click on the "Appearance" tab. Click on the "widgets" option. Drag the Twitter widget box into the area of the website that you would like it to appear. These website area boxes are usually located in the upper right section of the widget page. Enter your Twitter website URL, choose a title and choose how many tweets you would like to appear on your website.



3.) Open a new browser tab, go to Twitter.com, and log into your Twitter profile.

If your website did not have an option to add Twitter automatically, then you can still do it with one of Twitter's badge options.




4.) Find the "Twitter" box on the left or right hand side of your screen.

Click on "Resources." This should take you to a page called "Buttons, widgets, logos, and more".



5.) Click on the "widgets" option.

Click on "My Website." Read the brief descriptions of the types of Twitter boxes you can put on your website, and then click the "Profile", "Search", "Faves", or "List" option.
  • Most people would choose to use the Profile widget. This would only post your tweets, rather than the tweets of your followers. It gives you the most control over what your website viewers will see.



6.) Click on all the option tabs on the "Customize your Profile Widget" page. 

You can choose your username, the number of tweets that show up, the color of your Twitter box, the dimensions and more. Each choice that you make will be added to the HTML code for your website Twitter box.
  • You can see an example of what your Twitter box will look like on the right hand side of the screen. Change the colors and size according to what will best match your website's appearance.



7.) Click "Test" or "Finish and Grab Code".

Once the code is generated, copy the entire box. Make sure to get every symbol, or your Twitter box may not work.



8.) Return to your blog or website's admin page.

Choose the area of your website where you would like the Twitter box to appear. Paste the HTML code in the correct place on your website.
  • If your website is very user-friendly, it may have an "easy editor" on the admin page. Find the "HTML Code" tab or section. Paste the Twitter HTML code in this section.



9.) Save your changes on your website.

If you want to make changes to your Twitter badge in the future, you will need to return to your Twitter page and go through the same process, in order to create new HTML code.


Things You'll Need : -

Web programmer/IT help Web browser Twitter account Website/blog administrative account

Tricks to buy Xiaomi Redmi Note 4 on Flipcart, Amazone | Google chrome extension

Hello Friends., Brand new company Xiaomi launched Redmi Note 4 in India 19 January. Buy Redmi Note 4 (2GB/3GB/4GB) starting at Rs.9,999* Next Sale on 02 June @ 12 Noon exclusively available on Flipkart and Mi India.

Tricks to buy Xiaomi Redmi Note 4 on Flipcart, Amazone | Google chrome extension

Trick to buy Redmi 4A from Amazon India, Flipkart or mi.com

How to Purchase Redmi 4A | Redmi Note 4 -

As usual, Way2trick brings you exclusive and proven methods to buy Redmi note 4 from flipkart successfully. You can use our android app or chrome extension. Both these methods have proven themselves in the past to successfully buy redmi note 3, redmi 3s and redmi 3s prime.

How to buy Xiaomi Redmi Note 4 from Flipkart -

Steps :- 


1. Login / Register into Flipkart application http://www.flipkart.com
2. Visit Redmi Note 4 sale page. (Next Sale on 02 June @ 12 Noon)
3. Add Product To Cart.
4. Update Shipping Details.
5. Complete Your Order.


Install Auto-buy Chrome extension from Chrome web store (V4.0.28*)

Download From Here.. ]


How to buy Redmi Note 4 from Flipkart using Chrome extension:- 

  • Login into flipkart application http://flipkart.com
  • AddToChrome
  • Install Auto-buy chrome extension from Chrome web store.
  • You’ll see its icon16appear to the right of the address bar. To start using it, just click the icon.
  • Click on flipkart logo FST_extension_flipkart-logo for Redmi Note 4 sale.
  • Choose the variant and Refresh the sale page from 11:54Am Or before 5 minute of the Flash sale. 
Note: This is just open sale there will be no timer in sale page but stil we have tuned the auto-buy extension to make sure it will add Redmi Note 4 automatically to cart when 'Buy Now' button appears in sale page.

Tricks to buy Xiaomi Redmi Note 4 on Flipcart, Amazone | Google chrome extension

Related Posts Plugin for WordPress, Blogger...

Labels

404 AdBlock Add-on Airtel GPRS Trick Airtel SMS Trick Alexa Amazon Amazon Kindle Amazon Prime Android Android 8 Android Oreo antivirus Apple Apple Mac ASCII Audacity Audio Authotkey Backup Balance Transfer in Vodafone Battery Bing Blogger Blogging Bookmarklet Browser Camera Chromebook clock Cloud colors command lines Computer Computer Tricks configuration Contact Creative Commons Credit Card CSS devolop DIY Doodle DOS Download Dropbox E-Mail eBook Email Email Attachment Embed Encryption English Error Evernote Eyes Facebook Facebook Tricks Feedburner Flipkart Font Foursquare Free Internet Free sms trick in Vodafone G Mail Gadget Game Getty Images GIF Gists Github Google Google AdSense Google Analytics Google Apps Google Chrome Google Contacts Google Currents Google DNS Google Docs Google Drive Google Earth Google Font Google Forms Google Images Google Map Google Photos Google Play Store Google Plus Google Print Google Reader Google Script Google Sheets Google Spreadsheet Google Translate GPRS Setting GPS Hacking Health App HelloFax Hindi Hoodie HTML Icons idea Image Editing Images IMEI Indian Railways Infographics Instagram Internet Internet Explorer Internet Tricks iOS iPad iPhone IRCTC iTunes iTV JavaScript JioCinema JioTV Junglee Kindle Language Translation Laptop Laptop. TV Life Time FREE GPRS Life-Style Link Linkedln Linux logo Make Money Online Microdoft Powerpoint Microdoft Word Microsoft Office Microsoft Outlook Mobile Mosaic Music Name Networking nexus Notepad OCR Online Shopping Open DNS OS Outlook Password PDF Petya Phillips Hue Lights Photogtraphy Pixel Play Station Podcasts Pokemon Pokemon Go Polls Print Productivity Proxy Server Pushbullet QR Code Ransomware Reddit Reliance Hack GPRS Reliance Jio RGB Ringtone Router RSS Safe Mode Samsung Galaxy S Scrabble Screen Capture Screen Sharing Screencast Secrets Security Send free sms from PC SEO Sierra Skype Slideshare SMBv1 SMS Snapchat Snapdeal Social Media Solution Sound Device Speech Recognition Sql Steam Sync Synology NAS Tata Docomo GPRS trick Teleprompter Torrent Trick Tricks TV Twitter UltraISO Unicode Unknown Extension Unlimited 2GB Unlimited 3GB Unlimited GPRS USB USB Security Key Video Editing virtual desktop Virus attack VLC Vodafone 110% working trick for GPRS Vodafone 3g Vodafone GPRS VPN wallpapers WannaCry Web Design Web Domain Website Wget Whatsapp WiFi Wikipedia Windows Windows 10 Windows 10 S Windows KN Windows Tricks windows updates Winows N Wolfarm Alpha WordPress XBox YouTube Zip
Twitter Delicious Facebook Digg Stumbleupon Favorites More