Make all posts of a category to only appear on the sidebar of that particular page

I have created a top navigation menu based on categories and assigned all posts to different categories. What I want is for each "page" to only show posts from that category. For example I have 5 posts in "Home" and 10 posts in "Articles". I want the Home page to show 5 posts on the sidebar and show 10 posts in the Articles page.

I have tried different widgets such as wp-posts-widget but these only list either all posts from all categories or show categorised posts on ALL pages.

Please help

Run function after loading components into gutenberg editor sidebar

I would like to run a function after I load the meta box/components into the sidebar just in the gutenberg editor.

I know I could do it with add_action(‘add_meta_boxes’), but the function I want to run only works in the gutenberg editor. So how do I make this shot on Gutenberg’s JS?

Tried something like below, but doesn’t work.

wp.hooks.addAction('add_meta_boxes', 'cgb/generic-call-block', function () {     console.log(         'after the editor sidebar components have loaded'     ) }) 

Need to make sidebar responsive only when screen width is greater than 1024px

I’m new to WordPress and I want to make my sidebar responsive when the screen width is greater than 1024px. currently, the sidebar becomes responsive when the screen width is greater than 768px.

The website in concern is https://worklifeandmoney.com

I want to achieve this through additional CSS. I’m using the NewsUp theme. Any kind of help will be greatly appreciated. Thank you!

Update: I tried to make it work with flex but couldn’t succeed.

/* sidebar responsiveness */ @media (min-width: 1024px) .col-md-3 {     -ms-flex: 0 0 25%;     flex: 0 0 25%;     max-width: 25%; } 

Sidebar widget not partial refreshing for first widget on add and remove action

When you add the first widget in the sidebar it’s a refreshing customizer completely and not partial refreshing.

  • Go to Customizer
  • Go to the Widgets panel.
  • Remove all the widgets one by one.
  • At the last widget when you remove it, it refreshes the customizer.
  • When adding the first widget it again refreshes the customizer.
  • First onward, it partially refreshing the customizer as expected.

Please find the attached video for further reference: https://a.cl.ly/WnulD9r6

Is it the right behavior?

Trying to style Woocommerce sidebar Cart Widget

I have looked at length to find CSS that will change the background color, border radius and product info text color. I think this may not be a "mini cart". The price of the item, subtotal and View Cart / Checkout buttons follow the styling Ive done to the cart. I have successfully changed my product text color on my actual Cart page. So frustrating! Help is much appreciated.

Add ID to widget within a dynamic sidebar

I would like my widgets to have a unique ID, preferably based on the title given to the widget. My specific case is that I would like to have a jump link (<a href="#widget-title">) to target widgets in a dynamic sidebar located in the footer of my site. I would like my widget to be wrapped in a div, i.e. <div id="widget-title">, or even better, if I could add that id to the tag that contains the widget’s title, i.e. <h3 id="widget-title"> (I’d love to avoid an extraneous div).

I know that each widget has its own ID somewhere that I could access, but I worry that if I use that, then add/change/delete widgets later, the ID may change. But I can and will always keep the widget title consistent. Right now the widget I have in mind has an ID of custom_html-4, but I’d like something more static and semantic.

Left Sidebar Menu design with hierarchy

Current scenario: I’ve a webapp, in which there is a left sidebar. There are some menuItems and subMenuItems in sidebar. This hierarchy can go to N level. enter image description here New Requirement: Now There can be multiple programs in this application. User can switch program at any time. Each program has some menuAreas. User can also switch between menuAreas. Each menuArea has its own list of menuItems (and subMenuItems in hierarchy). At a time, User can only see menuItems for selected program and menuArea. These menuItems should appear at same place where current menuItems appear. Can anyone suggest UX for this scenario?