| Table of Contents | ||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
|
WordPress
Setup Basics
...
Access Your WordPress Admin Dashboard
Log in to your WordPress site by visiting yourwebsite.com/wp-admin. Enter your username and password to access the admin dashboard.
...
Choose Where to Embed the HTML
You can embed HTML in various sections of your WordPress site, including:
Posts
Pages
Widgets
...
Embed HTML in a Post or Page
Create or Modify a Post/Page:
In the dashboard, navigate to either Posts or Pages.
Click Add New or select an existing post/page to edit.
Switch to Text Mode:
Once you're in the editor, locate the preview field and switch to Text Mode (or Code Editor in some versions of WordPress).
This will display the raw HTML code for the page.
Embed the Widget:
Decide where the widget should be placed on the page. For example, below the header element.
In the code, find the closing tag for the header element (
</header>).Paste the widget's HTML code below the closing header tag.
Preview and Apply Changes:
Click the Preview Changes button in the top-right corner to see how the widget will appear.
If you're satisfied, click the Update button to save your changes.
Review the Embedded Widget:
After saving, the page will reload.
Use the permalink to view the updated page with the embedded widget.
Revert Changes if Needed:
If you want to remove or adjust the widget:
Return to the Edit page.
Delete or modify the widget's code in Text Mode.
Click Update to apply the changes.
...
Embed HTML within a Widget
Access the Widgets Section:
From the dashboard, navigate to Appearance > Widgets.
Click the + (Plus) button in the top-right corner.
Add a Custom HTML Block:
In the search bar, type Custom HTML and select it.
A new block labeled "Custom HTML" will appear.
Position the Widget:
To adjust the position, click the Drag button and move the widget to the desired location.
Insert Your HTML Code:
Paste the widget's HTML code into the Write HTML… field.
Click the Preview button to see how the widget will appear.
Apply Changes:
Once satisfied with the preview, click the Update button to save the changes.
A "Widget saved" notification will appear in the bottom-left corner of the page.
View the Embedded Widget:
Use the page link to review the embedded widget in action.
Shopify
...
Embed the Widget in the Website's HTML Code
Access the Theme Code:
Log in to your Shopify Admin at http://shopify.com .
Navigate to Online Store > Themes > Actions > Edit Code.
...
Click the Save button to apply your changes.
Use the Preview Store button to check how the widget appears on your site.
Embed the Widget in the Home, Product, or Collection Page
Access the Theme Customizer:
...
Paste the widget code into the Liquid Code field.
Click Save to apply the changes.
GoDaddy
1. Access Your GoDaddy Account
Visit godaddy.com and log in to your account.
Open the website you want to edit using the GoDaddy Website Builder.
2. Edit Your Website
Choose the Page and Section:
Click Edit Website in the GoDaddy Website Builder.
Navigate to the page where you want to embed the widget.
Click Add Section in the area where you’d like the widget to appear.
3. Embed the Widget Code
Insert HTML Code:
From the available section options, select Files & Web > HTML > Add.
Paste the widget's embed code into the Custom Code field.
Preview and Publish:
Click Preview to check the widget's placement and appearance on the page.
If satisfied, click Publish to make the widget live on your website.