{"id":106970,"date":"2020-12-11T15:38:38","date_gmt":"2020-12-11T22:38:38","guid":{"rendered":"https:\/\/www.geni.com\/blog\/?p=106970"},"modified":"2020-12-11T15:41:57","modified_gmt":"2020-12-11T22:41:57","slug":"new-customization-options-for-the-family-tree","status":"publish","type":"post","link":"https:\/\/www.geni.com\/blog\/new-customization-options-for-the-family-tree-106970.html","title":{"rendered":"New Customization Options for the Family Tree"},"content":{"rendered":"\n<p>Over the last few months, we have been hard at work on the latest enhancements to the HTML version of the family tree. Today we are happy to announce new customization options to help you work more comfortably in the family tree. Now you can change the font size and the color theme in the tree to better suit your needs. You may choose from a set of available themes or pick your own color theme by customizing the shades of our classic colors for male, female, and unknown gender nodes and the background.\u00a0<\/p>\n\n\n\n<p>You can access these new customization options in your Tree Preferences by clicking on the gear icon at the left edge of the tree.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><a href=\"https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/gear.png\" target=\"_blank\" rel=\"noreferrer noopener\"><img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"361\" src=\"https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/gear-600x361.png\" alt=\"\" class=\"wp-image-106971\" srcset=\"https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/gear-600x361.png 600w, https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/gear-300x181.png 300w, https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/gear-768x462.png 768w, https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/gear-1536x925.png 1536w, https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/gear-2048x1233.png 2048w\" sizes=\"(max-width: 600px) 100vw, 600px\" \/><\/a><\/figure><\/div>\n\n\n\n<p>Select the \u201cCustomize\u201d tab to view your customization options.\u00a0<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large is-resized\"><a href=\"https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/tabs.png\" target=\"_blank\" rel=\"noreferrer noopener\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/tabs-600x264.png\" alt=\"\" class=\"wp-image-106972\" width=\"600\" height=\"264\" srcset=\"https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/tabs-600x264.png 600w, https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/tabs-300x132.png 300w, https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/tabs-768x338.png 768w, https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/tabs-1536x675.png 1536w, https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/tabs.png 1652w\" sizes=\"(max-width: 600px) 100vw, 600px\" \/><\/a><\/figure><\/div>\n\n\n\n<div style=\"height:20px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">Change Font Size<\/h3>\n\n\n\n<div style=\"height:20px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p>Here you can choose between Default and Large font sizes. The Default text size will show more of the name on the tree nodes, but in a smaller font.\u00a0<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><a href=\"https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/customize_tab.png\" target=\"_blank\" rel=\"noreferrer noopener\"><img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"419\" src=\"https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/customize_tab-600x419.png\" alt=\"\" class=\"wp-image-106973\" srcset=\"https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/customize_tab-600x419.png 600w, https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/customize_tab-300x209.png 300w, https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/customize_tab-768x536.png 768w, https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/customize_tab-1536x1072.png 1536w, https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/customize_tab.png 1632w\" sizes=\"(max-width: 600px) 100vw, 600px\" \/><\/a><\/figure>\n\n\n\n<p style=\"font-size:11px\" class=\"has-text-align-center\"><em>Default font size<\/em><\/p>\n\n\n\n<p>The Large text size will show less of the names on a node, but in a larger font.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><a href=\"https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/large_font.png\" target=\"_blank\" rel=\"noreferrer noopener\"><img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"420\" src=\"https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/large_font-600x420.png\" alt=\"\" class=\"wp-image-106974\" srcset=\"https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/large_font-600x420.png 600w, https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/large_font-300x210.png 300w, https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/large_font-768x538.png 768w, https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/large_font-1536x1076.png 1536w, https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/large_font.png 1633w\" sizes=\"(max-width: 600px) 100vw, 600px\" \/><\/a><\/figure>\n\n\n\n<p style=\"font-size:11px\" class=\"has-text-align-center\"><em>Large font size<\/em><\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Customize Colors<\/h3>\n\n\n\n<div style=\"height:20px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p>In addition to our default colors in the tree, you may now also choose from a set of new color themes or customize the shades of our classic colors to find a color theme that works best for you. You can click on the dropdown to choose from a list of available themes. The choices include: Default, Flashy, Mahogany, Newsprint, Primary, and Night. A preview of the chosen theme will appear on the screen.\u00a0<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><a href=\"https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/themes.png\" target=\"_blank\" rel=\"noreferrer noopener\"><img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"419\" src=\"https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/themes-600x419.png\" alt=\"\" class=\"wp-image-106975\" srcset=\"https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/themes-600x419.png 600w, https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/themes-300x210.png 300w, https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/themes-768x537.png 768w, https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/themes-1536x1074.png 1536w, https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/themes.png 1631w\" sizes=\"(max-width: 600px) 100vw, 600px\" \/><\/a><\/figure><\/div>\n\n\n\n<p>Once you have chosen a theme, click the \u201cSubmit\u201d button. Here\u2019s a look at the new Mahogany theme in the tree:<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><a href=\"https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/mahogany.png\" target=\"_blank\" rel=\"noreferrer noopener\"><img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"290\" src=\"https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/mahogany-600x290.png\" alt=\"\" class=\"wp-image-106976\" srcset=\"https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/mahogany-600x290.png 600w, https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/mahogany-300x145.png 300w, https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/mahogany-768x371.png 768w, https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/mahogany-1536x742.png 1536w, https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/mahogany-2048x989.png 2048w\" sizes=\"(max-width: 600px) 100vw, 600px\" \/><\/a><\/figure><\/div>\n\n\n\n<p>You may also create your own custom theme to best fit your preferences. To begin, click on the element in the preview window that you wish to change (the male tree node, the female node, the unknown gender node, or the background). Alternatively, you can click the words \u201cMale,\u201d \u201cFemale,\u201d \u201cUnknown,\u201d or \u201cBackground\u201d shown as links in step 1.\u00a0<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><a href=\"https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/select_element.png\" target=\"_blank\" rel=\"noreferrer noopener\"><img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"421\" src=\"https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/select_element-600x421.png\" alt=\"\" class=\"wp-image-106977\" srcset=\"https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/select_element-600x421.png 600w, https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/select_element-300x210.png 300w, https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/select_element-768x539.png 768w, https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/select_element-1536x1077.png 1536w, https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/select_element.png 1637w\" sizes=\"(max-width: 600px) 100vw, 600px\" \/><\/a><\/figure><\/div>\n\n\n\n<p>Next use your cursor to choose a shade in the color bar for your chosen element (or on touch devices, simply touch the color bar and drag your finger until you find a shade you like). Once you are satisfied with your chosen colors, click \u201cSubmit\u201d to save and apply your new color scheme to the tree.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><a href=\"https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/custom_colors_tree.png\" target=\"_blank\" rel=\"noreferrer noopener\"><img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"293\" src=\"https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/custom_colors_tree-600x293.png\" alt=\"\" class=\"wp-image-106978\" srcset=\"https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/custom_colors_tree-600x293.png 600w, https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/custom_colors_tree-300x146.png 300w, https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/custom_colors_tree-768x375.png 768w, https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/custom_colors_tree-1536x750.png 1536w, https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/custom_colors_tree-2048x1000.png 2048w\" sizes=\"(max-width: 600px) 100vw, 600px\" \/><\/a><\/figure><\/div>\n\n\n\n<p>We\u2019re very excited to bring you these new customization options in the HTML version of the family tree. If you are still using the Flash version of the tree, you can switch to the HTML version now by clicking on the small triangle to the right of \u201cTree\u201d at the top of the page and select \u201cSwitch to the HTML tree.\u201d As browsers begin to retire the Flash app this month, eventually all Geni users will be moved to the HTML version of the tree.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"379\" height=\"128\" src=\"https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/switch_html.png\" alt=\"\" class=\"wp-image-106979\" srcset=\"https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/switch_html.png 379w, https:\/\/www.geni.com\/blog\/wp-content\/uploads\/2020\/12\/switch_html-300x101.png 300w\" sizes=\"(max-width: 379px) 100vw, 379px\" \/><\/figure><\/div>\n\n\n\n<p>Play around with these new customization options in your <a href=\"https:\/\/www.geni.com\/family-tree\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\" (opens in a new tab)\">tree<\/a> now and let us know what you think!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Over the last few months, we have been hard at work on the latest enhancements to the HTML version of the family tree. Today we are happy to announce new customization options to help you work more comfortably in the family tree. Now you can change the font size and the color theme in the tree to better suit your needs. You may choose from a set of available themes or pick your own color&#8230; <a class=\"read-more\" href=\"https:\/\/www.geni.com\/blog\/new-customization-options-for-the-family-tree-106970.html\"><span>Read the full story<\/span><\/a><\/p>\n","protected":false},"author":81,"featured_media":106989,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"om_disable_all_campaigns":false,"footnotes":""},"categories":[171],"tags":[7060,261,6873,531],"class_list":["post-106970","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-company-news","tag-custom-colors","tag-geni","tag-html-tree","tag-news"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.geni.com\/blog\/wp-json\/wp\/v2\/posts\/106970"}],"collection":[{"href":"https:\/\/www.geni.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.geni.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.geni.com\/blog\/wp-json\/wp\/v2\/users\/81"}],"replies":[{"embeddable":true,"href":"https:\/\/www.geni.com\/blog\/wp-json\/wp\/v2\/comments?post=106970"}],"version-history":[{"count":9,"href":"https:\/\/www.geni.com\/blog\/wp-json\/wp\/v2\/posts\/106970\/revisions"}],"predecessor-version":[{"id":106988,"href":"https:\/\/www.geni.com\/blog\/wp-json\/wp\/v2\/posts\/106970\/revisions\/106988"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.geni.com\/blog\/wp-json\/wp\/v2\/media\/106989"}],"wp:attachment":[{"href":"https:\/\/www.geni.com\/blog\/wp-json\/wp\/v2\/media?parent=106970"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.geni.com\/blog\/wp-json\/wp\/v2\/categories?post=106970"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.geni.com\/blog\/wp-json\/wp\/v2\/tags?post=106970"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}