2

I want to move the category title to this image:

enter image description here

Is it possible to do it with the layout.xml or is CSS needed to move it there?

1

Place the following code in your theme's catalog_category_view.xml file right before the closing body tag <move element="page.main.title" destination="columns.top" before="-"/>.

You may also be able to place it in the admin category page layout xml updates area, though offhand I'm unsure if M2 allows the <move> tag in that location.

| improve this answer | |
  • The solution you offered doesnt work, it overlays the image over the filters. – Wouter Stulp Feb 28 '19 at 11:32
  • 1
    Can you add a copy of your catalog_category_view.xml and a screenshot of the overlap? What version of Magento2 are you using? You could also try <move element="page.main.title" destination="columns.top" before="category.view.container"/>. I tried this on m2 instance I have spun up and it moved the title above the image. Though, I also have the filter located in a different area than your original screenshot. – mlunt Feb 28 '19 at 15:52
  • Thanks for your response, i have fixed it with CSS, see my sollution – Wouter Stulp Mar 1 '19 at 10:02
1

I have added css to the image and the title:

@media all and (min-width: 768px), print {
   .category-view{
   width: 79.16666667%;
   float: right;
   -ms-flex-order: 2;
   -webkit-order: 2;
   order: 2;
 }
  .page-title-wrapper{
    width: 79.16666667%;
    float: right;
    -ms-flex-order: 2;
    -webkit-order: 2;
    order: 2;
  }
  .page-title-wrapper.product{
    width: 100%;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px){

  .category-view{
    width: 75%;
  }

  .page-title-wrapper{
    width: 75%;
  }
}

Now it gives the following result: enter image description here

| improve this answer | |

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.