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?

2 Answers 2

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.

3
  • The solution you offered doesnt work, it overlays the image over the filters. Commented Feb 28, 2019 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
    Commented Feb 28, 2019 at 15:52
  • Thanks for your response, i have fixed it with CSS, see my sollution Commented Mar 1, 2019 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

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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