{"id":5213,"date":"2023-11-11T13:47:45","date_gmt":"2023-11-11T13:47:45","guid":{"rendered":"https:\/\/docs.redsun.design\/marni\/?page_id=5213"},"modified":"2025-02-14T14:11:39","modified_gmt":"2025-02-14T14:11:39","slug":"widgets","status":"publish","type":"page","link":"https:\/\/docs.redsun.design\/marni\/widgets\/","title":{"rendered":"Widgets"},"content":{"rendered":"\n<h3 class=\"wp-block-heading\" id=\"widgets\">Widgets<\/h3>\n\n\n\n<p>To add, remove, or edit your sidebar widgets, go to&nbsp;<strong>Appearance &gt; Widgets<\/strong>.<br>On the left, you will see a list of the available widgets to choose from.<br>On the right, you will see the 9 widget areas in the theme.<br><br>To add a widget to your sidebar, simply drag &amp; drop a widget from the left into any of the sidebars on the right.<\/p>\n\n\n\n<p>MARNI includes 4 custom widgets and recommends (includes styles) for 2 widgets:<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">INCLUDED WIDGETS<\/h4>\n\n\n\n<ol class=\"wp-block-list\">\n<li><strong>MARNI &#8211; Categories widget<\/strong><br><img loading=\"lazy\" decoding=\"async\" width=\"240\" height=\"431\" class=\"wp-image-5318\" style=\"width: 240px;\" src=\"https:\/\/docs.redsun.design\/marni\/wp-content\/uploads\/sites\/5\/2025\/02\/catwidget.png\" alt=\"\" srcset=\"https:\/\/docs.redsun.design\/marni\/wp-content\/uploads\/sites\/5\/2025\/02\/catwidget.png 800w, https:\/\/docs.redsun.design\/marni\/wp-content\/uploads\/sites\/5\/2025\/02\/catwidget-167x300.png 167w, https:\/\/docs.redsun.design\/marni\/wp-content\/uploads\/sites\/5\/2025\/02\/catwidget-570x1024.png 570w, https:\/\/docs.redsun.design\/marni\/wp-content\/uploads\/sites\/5\/2025\/02\/catwidget-768x1380.png 768w\" sizes=\"auto, (max-width: 240px) 100vw, 240px\" \/><br>The Categories widget displays a list of your categories including the category image.<br>You can set the image for each category in Posts > Categories, click &#8220;Edit&#8221; for a category and upload your image.<br><br>OPTIONS:\n<ul class=\"wp-block-list\">\n<li>Include \/ Exclude Categories:<br>Select &#8220;Include below categories&#8221; or &#8220;Exclude below categories&#8221; from the dropdown field. Then simply enter the category IDs into the field below, separated by comma. You can find the ID for each category in Posts &gt; Categories, in the categories table on the right hand side.<\/li>\n\n\n\n<li>Category image height:<br>set a height for the category images (in pixels). Min height = 60, Default is 120.<\/li>\n\n\n\n<li>If you are adding the widget into the Sidebar Home Top, you have additionaly the option to display three, four or five categories per row.<\/li>\n<\/ul>\n<\/li>\n\n\n\n<li><strong>MARNI &#8211; Featured Post widget<\/strong><br><img loading=\"lazy\" decoding=\"async\" width=\"240\" height=\"270\" class=\"wp-image-5319\" style=\"width: 240px;\" src=\"https:\/\/docs.redsun.design\/marni\/wp-content\/uploads\/sites\/5\/2025\/02\/featuredwidget.png\" alt=\"\" srcset=\"https:\/\/docs.redsun.design\/marni\/wp-content\/uploads\/sites\/5\/2025\/02\/featuredwidget.png 690w, https:\/\/docs.redsun.design\/marni\/wp-content\/uploads\/sites\/5\/2025\/02\/featuredwidget-267x300.png 267w\" sizes=\"auto, (max-width: 240px) 100vw, 240px\" \/><br>The Featurd Post widget displays a link to any of your posts. Simply select a post from the dropdown field.<br><br>OPTIONS:\n<ul class=\"wp-block-list\">\n<li>Display Thumbnail<\/li>\n\n\n\n<li>Display Category<\/li>\n\n\n\n<li>Display Post Date<\/li>\n<\/ul>\n<\/li>\n\n\n\n<li><strong>MARNI &#8211; Popular Posts widget<\/strong><br><img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"601\" class=\"wp-image-5320\" style=\"width: 600px;\" src=\"https:\/\/docs.redsun.design\/marni\/wp-content\/uploads\/sites\/5\/2025\/02\/ppwidget.jpg\" alt=\"\" srcset=\"https:\/\/docs.redsun.design\/marni\/wp-content\/uploads\/sites\/5\/2025\/02\/ppwidget.jpg 1199w, https:\/\/docs.redsun.design\/marni\/wp-content\/uploads\/sites\/5\/2025\/02\/ppwidget-300x300.jpg 300w, https:\/\/docs.redsun.design\/marni\/wp-content\/uploads\/sites\/5\/2025\/02\/ppwidget-1024x1024.jpg 1024w, https:\/\/docs.redsun.design\/marni\/wp-content\/uploads\/sites\/5\/2025\/02\/ppwidget-150x150.jpg 150w, https:\/\/docs.redsun.design\/marni\/wp-content\/uploads\/sites\/5\/2025\/02\/ppwidget-768x769.jpg 768w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \/><br>The Pouplar Posts widget displays a list of your most popular posts. This widget requires the\u00a0<strong><a href=\"https:\/\/wordpress.org\/plugins\/wordpress-popular-posts\" target=\"_blank\" rel=\"noreferrer noopener\">WordPress Popular Posts<\/a><\/strong>\u00a0plugin. You can install this plugin in\u00a0<strong>Appearance > Install Plugins<\/strong>. This widget is simply an extension to the WordPress Popular Posts plugin and provides a different styling than the widget that already comes with the plugin.<br><br>OPTIONS:\n<ul class=\"wp-block-list\">\n<li>Number of Posts<\/li>\n\n\n\n<li>Thumbnail Size<\/li>\n\n\n\n<li>Display Counter<\/li>\n\n\n\n<li>Display post date<\/li>\n\n\n\n<li>Sort posts by Total Views, Daily Views or Comments<\/li>\n\n\n\n<li>Time Range Filter<\/li>\n\n\n\n<li>Categories Filter<br>You can find the ID for each category in Posts &gt; Categories, in the categories table on the right hand side.<\/li>\n\n\n\n<li>Exclude Posts<br>You can find the post ID by going to Posts &gt; All Posts and hovering over the name of the post whose ID number you want to find. At the foot of the browser window you\u2019ll see the URL for the post or page. In the URL you will see the parameter post= followed by a number. That number is the ID number for the post or page.<\/li>\n\n\n\n<li>If you are adding the widget into the Sidebar Home Top, you have additionaly the option to display three, four or five categories per row.<\/li>\n<\/ul>\n<\/li>\n\n\n\n<li><strong>MARNI &#8211; Social widget<\/strong><br><img loading=\"lazy\" decoding=\"async\" width=\"240\" height=\"93\" class=\"wp-image-5321\" style=\"width: 240px;\" src=\"https:\/\/docs.redsun.design\/marni\/wp-content\/uploads\/sites\/5\/2025\/02\/socialwidget.png\" alt=\"\" srcset=\"https:\/\/docs.redsun.design\/marni\/wp-content\/uploads\/sites\/5\/2025\/02\/socialwidget.png 424w, https:\/\/docs.redsun.design\/marni\/wp-content\/uploads\/sites\/5\/2025\/02\/socialwidget-300x116.png 300w\" sizes=\"auto, (max-width: 240px) 100vw, 240px\" \/><br>The Social Widget displays icons that link to your social accounts.<br>You can add social icons in Appearance > Customize > Connect > Social Accounts.<\/li>\n<\/ol>\n\n\n\n<h4 class=\"wp-block-heading\">RECOMMENDED WIDGETS<\/h4>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>MailChimp Sign-Up Form<\/strong><br><img loading=\"lazy\" decoding=\"async\" width=\"150\" height=\"110\" class=\"wp-image-5322\" style=\"width: 150px;\" src=\"https:\/\/docs.redsun.design\/marni\/wp-content\/uploads\/sites\/5\/2025\/02\/newsletter.png\" alt=\"\" srcset=\"https:\/\/docs.redsun.design\/marni\/wp-content\/uploads\/sites\/5\/2025\/02\/newsletter.png 670w, https:\/\/docs.redsun.design\/marni\/wp-content\/uploads\/sites\/5\/2025\/02\/newsletter-300x220.png 300w\" sizes=\"auto, (max-width: 150px) 100vw, 150px\" \/><br>Marni includes styling for the\u00a0<strong><a href=\"https:\/\/wordpress.org\/plugins\/mailchimp-for-wp\" target=\"_blank\" rel=\"noreferrer noopener\">MailChimp for WordPress<\/a><\/strong>\u00a0plugin.<br>Follow the below instructions in order to add a MailChimp newsletter sign-up form widget to your sidebar.\n<ol class=\"wp-block-list\">\n<li>Sign up at&nbsp;<a target=\"_blank\" href=\"http:\/\/mailchimp.com\/\" rel=\"noreferrer noopener\">mailchimp.com<\/a>&nbsp;and create a&nbsp;<a target=\"_blank\" href=\"http:\/\/kb.mailchimp.com\/lists\/growth\/create-a-new-list\" rel=\"noreferrer noopener\">newsletter list<\/a><\/li>\n\n\n\n<li>Install the &#8220;MailChimp for WordPress&#8221; plugin. You can do that in&nbsp;<strong>Appearance &gt; Install Plugins<\/strong>.<br>Once installed, go to the plugin&#8217;s Settings page and enter your API key.<\/li>\n\n\n\n<li>Go to&nbsp;<strong>Appearance &gt; Widgets<\/strong>&nbsp;and drag and drop the &#8220;MailChimp Sign-Up Form&#8221; widget into one of the sidebars.<\/li>\n\n\n\n<li>In order to customize your newsletter form, go to WP Dashboard &gt; MailChimp for WP &gt; Forms. If you want your newsletter sign-up form to look just like on the Marni demo, replace the code with the following code:<code>&lt;span class=\"subscribe-text serif-italic\"&gt;Don't miss a thing!&lt;\/span&gt; &lt;input type=\"email\" name=\"EMAIL\" placeholder=\"Enter Email\" required \/&gt; &lt;input type=\"submit\" value=\"Sign up\" \/&gt;<\/code>Click &#8220;Save Changes&#8221;.<\/li>\n<\/ol>\n<\/li>\n\n\n\n<li><strong>Smash Balloon Social Photo Feed<\/strong><br><img loading=\"lazy\" decoding=\"async\" width=\"1200\" height=\"210\" class=\"wp-image-5323\" style=\"width: 1200px;\" src=\"https:\/\/docs.redsun.design\/marni\/wp-content\/uploads\/sites\/5\/2025\/02\/instagram1.png\" alt=\"\" srcset=\"https:\/\/docs.redsun.design\/marni\/wp-content\/uploads\/sites\/5\/2025\/02\/instagram1.png 2520w, https:\/\/docs.redsun.design\/marni\/wp-content\/uploads\/sites\/5\/2025\/02\/instagram1-300x52.png 300w, https:\/\/docs.redsun.design\/marni\/wp-content\/uploads\/sites\/5\/2025\/02\/instagram1-1024x179.png 1024w, https:\/\/docs.redsun.design\/marni\/wp-content\/uploads\/sites\/5\/2025\/02\/instagram1-768x134.png 768w, https:\/\/docs.redsun.design\/marni\/wp-content\/uploads\/sites\/5\/2025\/02\/instagram1-1536x268.png 1536w, https:\/\/docs.redsun.design\/marni\/wp-content\/uploads\/sites\/5\/2025\/02\/instagram1-2048x358.png 2048w\" sizes=\"auto, (max-width: 1248px) 95vw, (max-width: 960px) 90vw, (max-width: 767px) 95vw, 1152px\" \/><br><img loading=\"lazy\" decoding=\"async\" width=\"360\" height=\"396\" class=\"wp-image-5324\" style=\"width: 360px;\" src=\"https:\/\/docs.redsun.design\/marni\/wp-content\/uploads\/sites\/5\/2025\/02\/instagram2.png\" alt=\"\" srcset=\"https:\/\/docs.redsun.design\/marni\/wp-content\/uploads\/sites\/5\/2025\/02\/instagram2.png 684w, https:\/\/docs.redsun.design\/marni\/wp-content\/uploads\/sites\/5\/2025\/02\/instagram2-273x300.png 273w\" sizes=\"auto, (max-width: 360px) 100vw, 360px\" \/><br>In order to display an Instagram feed, Marni recommends the\u00a0<strong><a href=\"https:\/\/wordpress.org\/plugins\/instagram-feed\/\" target=\"_blank\" rel=\"noreferrer noopener\">Smash Balloon Social Photo Feed<\/a><\/strong>\u00a0plugin.<\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"Widgets To add, remove, or edit your sidebar widgets, go to&nbsp;Appearance &gt; Widgets.On the left, you will see a list of the available widgets to choose from.On the right, you ...","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-5213","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/docs.redsun.design\/marni\/wp-json\/wp\/v2\/pages\/5213","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/docs.redsun.design\/marni\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/docs.redsun.design\/marni\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/docs.redsun.design\/marni\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/docs.redsun.design\/marni\/wp-json\/wp\/v2\/comments?post=5213"}],"version-history":[{"count":3,"href":"https:\/\/docs.redsun.design\/marni\/wp-json\/wp\/v2\/pages\/5213\/revisions"}],"predecessor-version":[{"id":5326,"href":"https:\/\/docs.redsun.design\/marni\/wp-json\/wp\/v2\/pages\/5213\/revisions\/5326"}],"wp:attachment":[{"href":"https:\/\/docs.redsun.design\/marni\/wp-json\/wp\/v2\/media?parent=5213"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}