{"id":5977,"date":"2022-09-28T11:11:05","date_gmt":"2022-09-28T08:11:05","guid":{"rendered":"https:\/\/creativethemes.com\/blocksy\/?post_type=documentation&p=5977"},"modified":"2024-04-29T18:41:13","modified_gmt":"2024-04-29T15:41:13","slug":"account","status":"publish","type":"documentation","link":"https:\/\/creativethemes.com\/blocksy\/docs\/header-elements\/account\/","title":{"rendered":"Account"},"content":{"rendered":"\n
\n
\"\"\n\t\t\t\n\t\t\t\t\n\t\t\t<\/svg>\n\t\t<\/button>
Account <\/strong>element in action<\/figcaption><\/figure>\n\n\n\n

The account element from Blocksy’s header builder helps your users login and register with your website, in a clean and easy to use fashion. The element has multiple configuration options, which we’ll check out in detail below.<\/p>\n<\/div>\n\n\n\n

\n

Granular Controls<\/h2>\n\n\n\n

With the account element, you’ll have two different states to configure — when the user is logged in and when they’re not. You’ll get different options for each state. Let’s note them down!<\/p>\n\n\n\n

Logged in state<\/h5>\n\n\n\n
\"\"\n\t\t\t\n\t\t\t\t\n\t\t\t<\/svg>\n\t\t<\/button>
Account element – logged in state options<\/figcaption><\/figure>\n\n\n\n

When the user is logged in, the account element transforms into a quick link or a drop down menu. These let you direct the user to the relevant parts of the website, such as the account page from WooCommerce, the WordPress user profile dashboard, a custom link or even log them out with a single tap.<\/p>\n\n\n\n

\n
\n
\"\"
Logged in account actions<\/figcaption><\/figure>\n<\/div>\n\n\n\n
\n
Account Action<\/h5>\n\n\n\n
Dropdown<\/h6>\n\n\n\n

This is a new option that lets you show a drop down of common account actions when the user hovers over the account element. There can be multiple actions, such as custom links, user information and avatar and a logout option to gracefully let the user leave the site.<\/p>\n\n\n\n

Link<\/h6>\n\n\n\n

This one turns the account element into a direct link to one of the following places.<\/p>\n\n\n\n