{"id":15685,"date":"2018-09-19T09:51:55","date_gmt":"2018-09-19T13:51:55","guid":{"rendered":"https:\/\/www.boldgrid.com\/support\/?p=15685"},"modified":"2020-03-12T14:39:22","modified_gmt":"2020-03-12T18:39:22","slug":"changing-the-menu-link-styles","status":"publish","type":"post","link":"https:\/\/www.boldgrid.com\/support\/boldgrid-crio-supertheme-product-guide\/changing-the-menu-link-styles\/","title":{"rendered":"Changing the Menu Link Styles"},"content":{"rendered":"<!DOCTYPE html PUBLIC \"-\/\/W3C\/\/DTD HTML 4.0 Transitional\/\/EN\" \"http:\/\/www.w3.org\/TR\/REC-html40\/loose.dtd\">\n<?xml encoding=\"utf-8\" ?><html><body><p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2018\/09\/boldgrid-crio-horizontal-image.png\" alt=\"\" width=\"800\" height=\"72\" class=\"alignnone size-full wp-image-15512\" srcset=\"https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2018\/09\/boldgrid-crio-horizontal-image.png 800w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2018\/09\/boldgrid-crio-horizontal-image-300x27.png 300w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2018\/09\/boldgrid-crio-horizontal-image-768x69.png 768w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2018\/09\/boldgrid-crio-horizontal-image-250x23.png 250w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2018\/09\/boldgrid-crio-horizontal-image-550x50.png 550w\" sizes=\"auto, (max-width: 800px) 100vw, 800px\" \/><\/p>\n<h2 id=\"how-to-change-the-menu-link-color\">How to change the Menu Link Color<\/h2>\n<p>In order to change the color of the menu links you will need to be in the <b>Menu Items<\/b> section.<\/p>\n<ul>\n<li>In the Dashboard navigate to <b>Appearance<\/b> &rarr; <b>Customize<\/b><\/li>\n<li>In the Customizer menu navigate to <b>Design &rarr; Menus &rarr; Menu Location &rarr; Menu Items &rarr; Link Color<\/b><\/li>\n<li>Click on the palette color that you wish to use<\/li>\n<li>Click on <b>Publish<\/b> in order to save your selection<\/li>\n<\/ul>\n<h2 id=\"how-to-change-the-menu-link-hover-style\">How to change the Menu Link Hover Style<\/h2>\n<p>In order to change the style of menu links on hover you will need to be in the <b>Menu Items<\/b> section.<\/p>\n<ul>\n<li>In the Dashboard navigate to <b>Appearance<\/b> &rarr; <b>Customize<\/b><\/li>\n<li>In the Customizer menu navigate to <b>Design &rarr; Menus &rarr; Menu Location &rarr; Menu Items &rarr; Hover <\/b><b>Style<\/b><\/li>\n<li>Click on the palette color that the text will change to on hover<\/li>\n<li>Click on <b>Publish<\/b> in order to save your selection<\/li>\n<\/ul>\n<p>There are also a number of <b>Hover Effects <\/b>that you can choose from, or leave at <b>No Hover Effects<\/b> to simply have the color change.  When the hover effect is enabled, you will see the color selected used for the effect when the mouse hovers over the selected menu item.<\/p>\n<p>Want more hover styles to choose from? <a href=\"https:\/\/www.boldgrid.com\/get-pro-crio\/\">Upgrade to Crio Pro today!<\/a><\/p>\n<h2 id=\"how-to-change-the-borders-for-menu-links\">How to Change the Borders for Menu Links<\/h2>\n<p>The settings here change the border and border radius that appears on every menu item.  If you want to control the border and border radius on the entire menu area <a href=\"\/support\/boldgrid-crio-supertheme-product-guide\/how-to-change-the-menu-border\/\">click here<\/a>.<\/p>\n<ul>\n<li>In the Dashboard navigate to <b>Appearance<\/b> &rarr; <b>Customize<\/b><\/li>\n<li>In the Customizer menu navigate to <b>Design &rarr; Menus &rarr; Menu Location &rarr; Menu Items &rarr; <\/b><b>Border<\/b><\/li>\n<li>Select a <b>Border Type<\/b> option<\/li>\n<li>Use the sliders to control the widths of your border sides<\/li>\n<li>Click on the palette color that you wish to use<\/li>\n<li>Click <b>Publish<\/b> to save your changes<\/li>\n<\/ul>\n<p>The Border Radius controls the roundness of your element&rsquo;s corners. A higher border radius values creates more rounded corners.  You can use the responsive tools to customize border options at different screen sizes.<\/p>\n<ul>\n<li>Scroll down to <b>Border Radius<\/b><\/li>\n<li>Use the sliders to adjust the roundness of the four corners<\/li>\n<li>Click <b>Publish<\/b> to save your changes<\/li>\n<\/ul>\n<p><b>Note<\/b>: You can use the <b>Undo Changes<\/b> option to remove current changes or <b>Delete Saved Settings<\/b> to reset to the default options.<\/p>\n<\/body><\/html>\n","protected":false},"excerpt":{"rendered":"<p>How to change the Menu Link Color In order to change the color of the menu links you will need to be in the Menu Items section. In the Dashboard navigate to Appearance &rarr; Customize In the Customizer menu navigate to Design &rarr; Menus &rarr; Menu Location &rarr; Menu Items &rarr; Link Color Click on [&hellip;]<\/p>\n","protected":false},"author":529,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_bbp_topic_count":0,"_bbp_reply_count":0,"_bbp_total_topic_count":0,"_bbp_total_reply_count":0,"_bbp_voice_count":0,"_bbp_anonymous_reply_count":0,"_bbp_topic_count_hidden":0,"_bbp_reply_count_hidden":0,"_bbp_forum_subforum_count":0,"bgseo_title":"Changing the Menu Link Styles | BoldGrid Crio","bgseo_description":"BoldGrid Crio has many design options for menu link styles. Color, hover effect, border and more can be set for each menu location.","bgseo_robots_index":"index","bgseo_robots_follow":"follow","footnotes":""},"categories":[573],"tags":[],"class_list":["post-15685","post","type-post","status-publish","format-standard","hentry","category-boldgrid-crio-supertheme-product-guide"],"acf":[],"_links":{"self":[{"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/posts\/15685","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/users\/529"}],"replies":[{"embeddable":true,"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/comments?post=15685"}],"version-history":[{"count":3,"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/posts\/15685\/revisions"}],"predecessor-version":[{"id":18057,"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/posts\/15685\/revisions\/18057"}],"wp:attachment":[{"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/media?parent=15685"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/categories?post=15685"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/tags?post=15685"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}