![]() ![]() ![]() You can either drag and drop the widget to the right of the screen and place it in the header, or when you click on the widget you will see a drop-down menu of its applicable locations, you can just select ‘ Header’ from this list and click the blue ‘ Add Widget’ button: ProteusThemes: IconBox is the widget you are looking for. Once you have located ‘ Header’, direct your attention to the left of the screen, where you will see a list of ‘ Available Widgets’. To do this, in your dashboard you need to go to Appearance -> Widgets and then within ‘ Theme Sidebars’ select ‘ Header’. My task was to add the icon boxes into the header of the homepage. It may seem obvious, but having your company’s phone number next to a telephone icon is a simple but effective way of improving your site’s user experience. Icon Box widgets are a very handy piece of visual language. These are the most important lessons I have learned so far. Just like before, my colleagues set me step-by-step tasks to set me on my way. It will be displayed below the Text.To go beyond the simple basics in my last WordPress Beginner blog, over the past couple of weeks I have been working to recreate one of our ProteusThemes demo pages. Link Areaĭrag a button or link into the icon box to nest it inside of the icon box. In this tab you can control the typography for the Heading and Text inside the Icon Box.Įach of these three tabs have identical typography settings, which are the same as those found at Advanced > Typography. Content Alignment - the alignment set here will only applies to screen widths below the width set in Vertical Layout Below.Vertical Layout Below - set the screen width below which the Icon Box contents will be aligned based on the Content Alignment in this tab.In this tab, you can control the responsiveness of the alignment of the elements within the Icon Box element. Link Space Below - sets the spacing below the link area of the Icon Box. ![]() Link Space Above - sets the spacing above the link area of the Icon Box.Text Space Below - sets the spacing below the text.Text Space Above - sets the spacing above the text.Heading Space Below - sets the spacing below the heading.Heading Space Above - sets the spacing above the heading.Otherwise, if Icon Position is set to either right or left, this controls the spacing to the right of the icon. If Icon Position is set to either top or bottom, this controls the spacing on the bottom of the icon. Icon Space After - sets the spacing after the icon.Otherwise, if Icon Position is set to either right or left, this controls the spacing to the left of the icon. If Icon Position is set to either top or bottom, this controls the spacing on top of the icon. Icon Space Before - sets the spacing before the icon.This parameter is visible only when Icon Position is set to left or right. Icon Vertical Alignment - aligns the icon vertically within the Icon Box element top, middle, or bottom.Icon Position - positions the icon relative to the text and link content: top, right, left, or bottom.Content Alignment - align all content within the element left, center, or right. ![]() The Icon Box element displays an icon with a heading and text.Īdd a Icon Box element to your page from Add+ > Helpers > Icon Box. ![]()
0 Comments
Leave a Reply. |