Getting started
This guide is designed to help you create a comprehensive stock symbol page using TradingView widgets. This page will provide up-to-date and accurate information about any stock you choose to display. The basic structure for this page will be built using simple HTML, while further functionality will be provided by integrating TradingView’s variety of widgets.
Setting up the page structure
Our journey begins with a basic HTML page, serving as the skeleton on which we will build our stock viewing platform. Here’s what that skeleton looks like:
You can view the starting page here and the source code for the entire starting page here. This includes CSS to style and define the layout.
Integrating TradingView Widgets into the page
TradingView offers a wide array of widgets designed to provide comprehensive information about a given stock. For this tutorial, we will be integrating the following widgets into our page:
Each widget is integrated into the page by embedding code directly into the HTML source. These widgets will be placed into the corresponding <section id="widget-name"></section>
element in the code. The integration of each widget will be discussed in detail in the following sections.
With the basic structure in place, we are ready to start integrating these widgets into our page. Let’s begin!