Help:Installing Widgets

Categories: WikiTree Help | WikiTree Love

Contents

How to Use Family Tree Widgets on Your Blog

Family Tree Widgets work best when embedded in blog posts rather than in the sidebar of your blog, due to the width needed to properly display your WikiTree content. For sidebar widgets that let you show off your WikiTree contributions, see Contributions Widgets.

Blogger

1. Go to the Tree & Tools page for any WikiTree profile with a Privacy Level of "Private with a Public Family Tree" or higher and scroll down to the "Family Tree Widgets" link.

2. Scroll down to where the HTML code is displayed in the box labeled Copy-and-paste this HTML code.

3. Highlight the text in the box, right-click with your mouse and select Copy.

4. In Blogger, under the Posting tab, click New Post.

5. Click on the Edit HTML tab[1] and then in the Content area, right-click with your mouse and select Paste.

6. Click the Compose tab to see how your widget will appear in the blog post.

7. Click Publish.

See an example of a Family Tree Widget on Tami Glatz's blog Relatively Curious. (Scroll down to the bottom.)

WordPress

1. Go to the Tree & Tools page for any WikiTree profile with a Privacy Level of "Private with a Public Family Tree" or higher and scroll down to the "Family Tree Widgets" link.

2. Scroll down to where the HTML code is displayed in the box labeled Copy-and-paste this HTML code.

3. Highlight the text in the box, right-click with your mouse and select Copy.

4. In WordPress, login and go to the Dashboard.

5. Scroll down to the Posts section in the left sidebar, expand the list and select New Post.

6. Click on the HTML tab and then in the Content area, right-click with your mouse and select Paste.

7. Click the Visual tab to see how your widget will appear in the blog post.

8. Click Publish. 

See examples of the Family Tree Widgets on our WikiTree blog:

How to Use Contributions Widgets on Your Blog

For the selection of Contributions Widgets, click the link near the top of your Contributions page.

These work best when embedded in a blog sidebar rather than in a blog post since they were created to always be displayed on your blog to let your visitors know about your WikiTree contributions. For widgets that let you show off a family tree, see Family Tree Widgets.

Blogger

1. Click the Contributions Widgets link on your Contributions page to see the variety of widgets available.

2. Scroll down to where the HTML code is displayed in any box labeled Copy-and-paste this HTML code.

3. Highlight the text in the box, right-click with your mouse and select Copy.

4. In Blogger, under the Design tab, click Add a Gadget.

5. Scroll through the Basics gadgets and select HTML/JavaScript. The Configure HTML/JavaScript dialog appears.

6. In the Title field, enter a title if desired. In the Content area, right-click with your mouse and select Paste.

7. Click Save. Click View Blog tab to see how your widget will appear in the sidebar of your blog.

See an example of a Contribution Widget on the sidebar of Sheri Bush's blog Twig Talk.

WordPress

1. Click the Contributions Widgets link. For the selection of Contributions Widgets, click the link near the top of your Contributions page.

2. Scroll down to where the HTML code is displayed in any box labeled Copy-and-paste this HTML code.

3. Highlight the text in the box, right-click with your mouse and select Copy.

4. In WordPress, login and go to the Dashboard. Scroll down to the Appearance section in the left sidebar, expand the list and select Widgets.

5. Locate Text and “drag” it to your Sidebar, placing it in the desired location on your sidebar.

6. In the Title field, enter a title if desired. In the Content area, right-click with your mouse and select Paste.

7. Click Save. Click your blog name in the Dashboard to view your blog and see how your widget appears in the sidebar of your blog.

See an example of a Contribution Widget on the sidebar of our WikiTree blog.

How to Use Widgets on Joomla

Thanks to Daniël Bouman for the following.

1. Download Mod HTML for Joomla module from here (you need to register to download).

2. Open Joomla administration.

3. Go to Extensions -> Extension Manager.

4. Choose the downloaded file (mod_j16html.zip) in the Upload Package File part and click the Upload and Install button.

5. Go to Extensions -> Module Manager.

6. Select the Joomla 1.6 HTML Module.

7. Change the title of the Module or choose to hide it.

8. Insert the widget HTML code in the HTML entry box.

9. Publish the module and place it somewhere on your page.

How to Use Widgets on Google Sites

1. Edit the page where you want to add the widget.

2. Select Insert -> More Gadget.

3. Search for 'iframe'.

4. Select the Include Gadget (iframe) by Scott Johnston.

5. Enter the URL in the widget code (the src field in the <iframe> tag) in the URL to content entry field.

6. Set the Width and Height so that the content fits (550x520 for the Family Tree widget).

7. Enter a title in the Display title on gadget entry field or disable the title.

8. Click the OK button.

Notes

If you need more help, don't hesitate to post a question on our G2G Forum.

  1. If you do not see the Edit HTML and Compose tabs, you may not be using the Updated Editor in Blogger. On the Settings tab, click on Basic and scroll down to the Global Settings section. Under Select post editor, select Updated editor and then click Save Settings.


This page was last modified 12:51, 24 May 2017. This page has been accessed 67 times.