How to add/update custom layout update on magento 2.3.4

You should create a module and run the patch

<?php

namespace [vendorname][modulename]SetupPatchData;

use MagentoFrameworkSetupModuleDataSetupInterface;
use MagentoFrameworkSetupPatchDataPatchInterface;
use MagentoCatalogSetupCategorySetup;
use MagentoCatalogSetupCategorySetupFactory;
use MagentoCatalogModelProduct;
use MagentoCatalogModelCategory;

/**
 * Add new custom layout related attributes.
 */
class UpdateCustomLayoutAttributes implements DataPatchInterface
{
    /**
     * @var ModuleDataSetupInterface
     */
    private $moduleDataSetup;

    /**
     * @var CategorySetupFactory
     */
    private $categorySetupFactory;

    /**
     * PatchInitial constructor.
     * @param ModuleDataSetupInterface $moduleDataSetup
     * @param CategorySetupFactory $categorySetupFactory
     */
    public function __construct(
        ModuleDataSetupInterface $moduleDataSetup,
        CategorySetupFactory $categorySetupFactory
    ) {
        $this->moduleDataSetup = $moduleDataSetup;
        $this->categorySetupFactory = $categorySetupFactory;
    }

    /**
     * @inheritDoc
     */
    public static function getDependencies()
    {
        return [];
    }

    /**
     * @inheritDoc
     */
    public function getAliases()
    {
        return [];
    }

    /**
     * @inheritDoc
     */
    public function apply()
    {
        /** @var CategorySetup $eavSetup */
        $eavSetup = $this->categorySetupFactory->create(['setup' => $this->moduleDataSetup]);
        $eavSetup->addAttribute(
            Product::ENTITY,
            'custom_layout_update_file',
            [
                'type' => 'varchar',
                'label' => 'Custom Layout Update',
                'input' => 'select',
                'source' => MagentoCatalogModelProductAttributeSourceLayoutUpdate::class,
                'required' => false,
                'sort_order' => 51,
                'backend' => MagentoCatalogModelProductAttributeBackendLayoutUpdate::class,
                'global' => MagentoEavModelEntityAttributeScopedAttributeInterface::SCOPE_STORE,
                'group' => 'Design',
                'is_used_in_grid' => true,
                'is_visible_in_grid' => true,
                'is_filterable_in_grid' => false
            ]
        );

        $eavSetup->addAttribute(
            Category::ENTITY,
            'custom_layout_update_file',
            [
                'type' => 'varchar',
                'label' => 'Custom Layout Update',
                'input' => 'select',
                'source' => MagentoCatalogModelCategoryAttributeSourceLayoutUpdate::class,
                'required' => false,
                'sort_order' => 51,
                'backend' => MagentoCatalogModelCategoryAttributeBackendLayoutUpdate::class,
                'global' => MagentoEavModelEntityAttributeScopedAttributeInterface::SCOPE_STORE,
                'group' => 'Custom Design',
                'is_used_in_grid' => true,
                'is_visible_in_grid' => true,
                'is_filterable_in_grid' => false
            ]
        );

        $eavSetup->updateAttribute(
            Product::ENTITY,
            'custom_layout_update',
            'is_visible',
            true
        );

        $eavSetup->updateAttribute(
            Category::ENTITY,
            'custom_layout_update',
            'is_visible',
            true
        );
    }
}

For anyone who has similar issue as @RonSayers (https://magento.stackexchange.com/a/311542/5983) - field without any options when using Porto theme (or any porto child themes).

Porto introduces a set of Smartwave modules, and while they are advertising as fully compatible with Magento 2.3 - they're not.

Smartwave_Megamenu is causing the issue as above. To fix, modify app/code/Smartwave/Megamenu/Model/Category/DataProvider.php and add 'custom_layout_update_file' in the design array.

It will show the options then.

I am struggling like @Bram Hammer. I placed the code below into app/design/frontend/Smartwave/porto_child/Magento_Catalog/layout/catalog_category_view_selectable_115_listview.xml and flushed cache. Porto Child is set to global under Content>Design>Configuration.

<body>
    <referenceContainer name="content">
        <referenceBlock name="product_list_toolbar">
            <action method="setData">
                <argument name="key" xsi:type="string">_current_grid_mode</argument>
                <argument name="value" xsi:type="string">list</argument>
            </action>
        </referenceBlock>
    </referenceContainer>
</body>

I still have no options under Catalog>Categories>ID: 115>Design>Custom Layout Update

I'm trying to have category 115 default to list view instead of grid view. Hopefully somebody can see what I'm doing wrong.

Any sort of idea why this has been done? I think is pretty bad to not be able to change Layout XML from the admin area anymore. It just makes it not very flexible. And it means that for any change on layout XML it will require a new deployment and a new file to be created. On a big website we could end up with loads of new XML files having to be created manually. Also, sometimes ID's on local environments are not the same as the ID's in staging or production environment. SO ...I am seeing this new update XML way quite useless.

In version 2.3.4 to add classes to the body tag for example, valid for pages::

<script type="text/javascript">
require([
    'jquery'       
], function (jQuery) {
    (function ($) {
        $("body").addClass('yourclass');
    })(jQuery);
});
</script>

Create a custom layout file for category:

app/design/frontend/<Vendorname>/<themename>/Magento_Catalog/layout

catalog_category_view_selectable_<Category ID>_<Layout Update Name>.xml

Also check and save theme setting as Global: Admin > Content > Design > Configuration https://prnt.sc/r89ico

As of Magento 2.3.4, merchants can select layout updates to be applied to specific Category/Product/CMS Page pages on the frontend. These layout updates are made by creating layout XML files following specific naming conventions.

For Categories:

catalog_category_view_selectable_<Category ID>_<Layout Update Name>.xml

where:

• Category ID is desired category ID
• Layout Update Name is what is shown as the option for Custom layout update field of Design section on Category Edit page.

For Products:

catalog_product_view_selectable_<Product SKU>_<Layout Update Name>.xml

where:

• Product SKU is the desired product’s SKU encoded as a URI. example: “My Product SKU” -> “My%20Product%20SKU”
• Layout Update Name is what is shown as the option for Custom layout update field of Design section on Product Edit page.

For CMS Pages:

cms_page_view_selectable_<CMS Page Identifier>_<Layout Update Name>.xml

where:

• CMS Page Identifier is the desired page’s URL Key with “/” symbols replaced with “_”
• Layout Update Name is what is shown as the option for Custom layout update field of Design section on CMS Page Edit page

These files must be placed in the appropriate folders for layout XML files. They will be available as Custom Layout Update options for Merchants after flushing the cache.

This is a link to the DevDocs: https://devdocs.magento.com/guides/v2.4/frontend-dev-guide/layouts/xml-manage.html#create-cms-pageproductcategory-specific-selectable-layouts