backdrop / backdrop-issues

Issue tracker for Backdrop core.
145 stars 40 forks source link

[UX] Setting up Page Title in Layouts uses the Wrong Title #4923

Open mikesoltis opened 3 years ago

mikesoltis commented 3 years ago

Update, May 17, 2024: This issue here was brought up in this Zulip thread: https://backdrop.zulipchat.com/#narrow/stream/218635-Backdrop/topic/Custom.20Title.20for.20node.20layout/near/439125533

@argiepiano provided some steps to reproduce that describe this bug more clearly:

... I wanted to mention the behavior of page titles of layouts that override the node path (node/%) is a bit confusing (bordering on buggy?). This is for a node layout that uses the "Default page title" in the "Page title settings".

  1. If the layout uses the "Main page content" block, then the value of node title field is used as the page title :+1:
  2. If the layout does NOT use the "Main page content" and instead uses field blocks, then:
    • If the node does NOT provide a menu link, the value of title field is still used as the page title :+1:
    • If the node DOES provide a menu link, then the value of the Menu link title is used as the page title :thinking: - this behavior is confusing, as site builders often wonder where the page title is coming from, given the behavior is very different from the other cases (it's not evident that the page title comes from the menu link title provided by the node, rather than the node title).

There was a recent question in the forum that addressed this.

I want to add that, if you do not have a layout overriding the node path, then the page title is always the node's field title (even if the node provides a menu link with a different text).


Initial issue summary

Description of the bug

Setting up Page Title in Layouts for a series of landing pages uses the Menu Link Title associated with the Page instead of the Page Title. It appears to be a bug since there is no mention of Menu Link Title anywhere and its not the behavior one would expect..

Steps To Reproduce

To reproduce the behavior:

  1. Create landing pages with a different titles than the menu link titles for these pages
  2. In the new layout for these pages, configure the "Page Title" section for Default page title.

Actual behavior

The page shows the Menu Link Title.

Expected behavior

The Page Title should be displayed.

Additional information

I tried looking for an explicit "Field_Title" under "Add Block", but only found "Page Title" which creates a block with the same result.

Thanks!

mikesoltis commented 3 years ago

Additional Info - I'm using the Simplo site as a test bed.

indigoxela commented 3 years ago

@mikesoltis Many thanks for your report.

I still seem to have trouble to understand the steps to reproduce, though.

Maybe I get it, if you post the contents of two exported config files here:

  1. The layout config of one of your landing pages
  2. The menu item config related to this layout

These configs can get exported as json files following these steps:

  1. Decide for a layout (you created several one, but one is sufficient as an example)
  2. Go to admin/config/development/configuration/single/export
  3. Select "Configuration group" - "Layouts" and "Configuration name" - chose your example
  4. Copy and paste here
  5. Select "Configuration group" - "Layout menu items" - related to the one you chose as an example
  6. Copy and paste here

Feel free to ask any question here, if you need better guidance. Possibly my description is yet too sparse.

mikesoltis commented 3 years ago

I think I see the confusion - The menu I was referring to is the Primary Navigation Menu. I created a Content Type called "Menu Landing Page" and when I create each one, I enter a long title for the Page Title and under Menu Settings, I select "Provide a menu link" and input a short Menu Link Title (which then shows up in the Primary Nav Menu). I created a layout for these Landing pages where I select the Page Title to be shown. Here is the export: menu_landing_page_layout.txt

In the rendered page, the short title from the Menu Link Title is shown, rather than the longer title from the Page Title.
Hope that helps -

stpaultim commented 3 years ago

@mikesoltis

I am also having a little trouble understanding your steps to reproduce. Let me repeat back what I understood and you can correct me, where I went wrong.

1) Start with fresh site 2) Create new content type called "Test" 3) Check box "Add a link into the menu for new content of this type" in Menu Settings of new content type 4) Check box "Primary Navigation" in Menu Settings of new content type 5) Create a node of type "Test" with the following title "This is a really, really, really, really, really long title" 6) Go here and edit the menu link title for this node to "Short title" - admin/structure/menu/manage/main-menu 7) Create a custom layout called "Test Layout" -- Layout template = Boxton -- Path = /node/% -- Visibility Condition = NID = 3 (3 is NID of our test node) 8) Add a custom block to "test layout" with custom text in it, to be sure that you know when this layout is being used. 9) Click on "Short Title" in menu 10) The page title is "This is a really, really, really, really, really long title" and my custom block is visible, so I know that I am on the right page and using the correct layout.

If I understand correctly, you did all of this, but your page title was "Short Title" instead of "This is a really, really, really, really, really long title"

I am not able to reproduce this, please let me know if I got the steps incorrect. I guess, I am a little confused about what you mean when you say "Create landing pages."

philsward commented 3 years ago

Oops... Wrong button.

mikesoltis commented 3 years ago

My steps were a bit different:

  1. Start with fresh site but I added these modules: Flexslider, CSS Injector, Insert, CKEditor, Webform
  2. same - Create new content type called "Test" (3-4 skip)
  3. Create a node of type "Test" with the following title "This is a really, really, really, really, really long title"
  4. While creating the new content above, in addition to entering a long Title, I also select the Menu Settings tab at the bottom of the edit page and verify "Provide a menu link" is checked and enter a shorter menu title. Save content.
  5. Create a custom layout called "Test Layout", but I am using Moscone for "Test Layout" and I am setting visibility in Configure Layout to the new content type "Test".
  6. The rendered node displays the short title for me. I confirm the right layout is being applied by clicking on the Configure Block button for the Title on the rendered node. It opens up the "Test Layout". (9-10 skip)

I also tested editing the new content node - unchecking the "Provide a Menu Link" box and then the rendered page shows the long title.

If I edit the node again and add back a short menu title - the short title is once again displayed on the rendered node.

indigoxela commented 3 years ago

Still experimenting, still can't reproduce.

Based on your description I got the expected title.

screenshot-menu-and-title-layout

I found one subtle difference in the layout setup:

Yours:

    "_config_name": "layout.layout.menu_landing_page",

    "settings": {
        "title": "",
        "title_display": "default",
        "title_block": "e007e6c1-eab2-48c1-a120-3278b06afc0e"
    },

Mine:

    "_config_name": "layout.layout.test_layout",

    "settings": {
        "title": "",
        "title_display": "default",
        "title_block": null
    },

At first I didn't use a title block, but even if I do, I still get the correct result: The page title is the node title (both, page main heading and meta title). The menu item in the main menu is the one from the node vertical tabs (below body form item).

Eventually there's something different in your title block setting?

Title blocks have their own... These are the steps:

Sorry, this was misleading... Your layout has a dynamic path (node/%), so your menu item won't get set via the layout overview page (admin/structure/layouts sub-section "Menu settings").

mikesoltis commented 3 years ago

I don't know what I did to misconfigure it...: But I get the menu title as the page title for View and Edit shows the node title: view Edit

indigoxela commented 3 years ago

But I get the menu title as the page title for View and Edit shows the node title

Weird...

What are your page title settings (for your title block)?

page-title-settings

indigoxela commented 3 years ago

Hm, wait a minute... Is this really the title block? Can you inspect the markup around that title? For instance with your browser's developer tools?

mikesoltis commented 3 years ago

inspector: <h1 class="page-title">Beamlines</h1>

page _title_settings

klonos commented 3 years ago

@mikesoltis thank you for taking time to contribute in the issue queue by reporting issues πŸ™ ...here's tip for you: you can wrap code snippets in GitHub comments with back ticks (`), which allows you to add HTML tags without having them be actually rendered πŸ˜‰ (I've edited your comment to do that for you - I hope you don't mind)

For more, see https://guides.github.com/features/mastering-markdown ...for code snippets specifically, scroll to the "Examples" section, and click the "code" pill-button:

...what follows is an example of how you would type something in a comment, followed by how that would be rendered when you save the comment:

Screen Shot 2021-01-30 at 8 45 42 pm
mikesoltis commented 3 years ago

Thanks - I tried / / - I'll use code fencing in the future.

mikesoltis commented 3 years ago

Another observation...I created a number of submenus for the primary nav menu under "Join" to anchors in the same node. When I render the page, the page title is taken from the LAST Menu Link Title in the Sub Menu.

last_menu_item

indigoxela commented 3 years ago

I created a number of submenus for the primary nav menu under "Join" to anchors in the same node. When I render the page, the page title is taken from the LAST Menu Link Title in the Sub Menu.

Pretty weird.

I'm sort of running out of ideas... Your layout contains several Views blocks. I suppose, you already checked, if one of those views has a contextual filter with a setting to override the page title?

Or maybe there's a contrib module that interferes with page titles? Do you have menu-related modules installed?

mikesoltis commented 3 years ago

Unfortunately, pages without views also show the same behavior and no view is really doing anything to the Primary Nav Menu or changing titles of nodes.

I removed most of the modules I added, but no change and the others do not impact the menus.

I will start building our 'real' site in about 2 weeks and I'll start with the basics and start with a nav menu and create a node to test. That way I have a better chance of determining what causes it - if it happens again.

stpaultim commented 3 years ago

Mike:

I'd be willing to schedule a meeting/screenshare with you this week to look at the problem you are having with the menu titles. I bet we could figure it out much quicker in a Zoom call.

Just let me know if you are interested.

Tim Erickson

On Sun, Jan 31, 2021 at 11:25 PM mikesoltis notifications@github.com wrote:

Unfortunately, pages without views also show the same behavior and no view is really doing anything to the Primary Nav Menu or changing titles of nodes.

I removed most of the modules I added but no change and the others do not impact the menus.

I will start building our 'real' site in about 2 weeks and I'll start with the basics and start with a nav menu and create a node to test. That way I have a better chance of determining what causes it - if it happens again.

β€” You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/backdrop/backdrop-issues/issues/4923#issuecomment-770575448, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAX7W62MDMKVRNS5RNQAPPLS4Y3LNANCNFSM4WYLVWQQ .

mikesoltis commented 3 years ago

Ok - Monday works - anytime after 3pm - thanks!

indigoxela commented 3 years ago

One last attempt - still unable to reproduce.

I Added a menu block (of main-menu) in the sidebar. Tried different settings for that menu block. Everything still works as expected.

main-menu-title

@stpaultim many thanks for taking over! :+1: I definitely ran out of ideas.

stpaultim commented 3 years ago

I just did a screenshare with @mikesoltis and can confirm that the problem does exist on his site, despite our inability to reproduce it on a clean installation of Backdrop core.

I have access to his development site and will try to do more testing to figure out what combination of contrib modules or specific configuration is causing this weird behavior.

It could still be core bug or it might be a contrib bug.

mikesoltis commented 3 years ago

I started working on our new website and was able to reproduce this issue.

First create a new Page. Create a menu link for the page. Make the title of the new page and the menu link name in the Primary Navigation menu different. Verify the title and menu name are correct. (This pages uses the default layout). Now create a new layout. Set Visibility Condition to node ID of new page. Now display the page. The displayed title is now the menu link title rather than the title of the page.

Hopefully this can now be reproduced and fixed! Thanks

klonos commented 3 years ago

Hopefully this can now be reproduced and fixed! Thanks

I haven't tried to reproduce this yet, but yes, that helps @mikesoltis πŸ‘πŸΌ

mikesoltis commented 3 years ago

Did anyone have a chance to reproduce? It would be nice to know if this is a bug or if I am missing an easy fix.

klonos commented 3 years ago

Hello @mikesoltis and sorry for not responding earlier.

I have broken down your steps and tried to reproduce, but I could not. Here's what I've done on a vanilla installation of Backdrop:

  1. go to node/add/page
  2. add "Page" as title
  3. leave all other things as they are, and scroll to the bottom of the page
  4. save the node -> the page is created with title "Page", and a menu item also called "Page" is added to the main navigation (page content type automatically creates menu items by default)
  5. edit the page
  6. switch to the "Menu settings" tab
  7. change the menu title to "Page menu different name"
  8. save -> menu item in the main navigation changed to "Page menu different name" πŸ‘πŸΌ ...and the page title remained "Page"
  9. go to admin/structure/layouts/add
  10. add a title for my layout
  11. select any template for the layout
  12. add node/% for the layout path
  13. add a Node: ID visibility condition, and set it to 3 (or whatever the node ID for "Page" is)
  14. save layout
  15. add a custom block in the layout, to make it easier to spot that this is what's being used
  16. save block configuration
  17. clear caches
  18. visit the page -> page title is still "Page" πŸ‘πŸΌ ...the block I placed in step 15 above is shown (so the new layout is in use) πŸ‘πŸΌ ...the menu title in the main navigation is still "Page menu different name" πŸ‘πŸΌ

If you are using different steps @mikesoltis, can you then please add them with as much detail as I did above? Thanks.

mikesoltis commented 3 years ago

That worked for me too. I can no longer reproduce the problem from scratch (drugs?).

I wound up deleting the current layout for any page that still displayed this issue. As soon as the default layout was being used, the page title and menu title showed correctly (different). I made new layouts for these pages and the page title and menu title remained correct (different). So I was able to fix the existing pages.

How these page/layouts got into this mode remains a mystery - but its all working now.

Thanks

klonos commented 3 years ago

I can no longer reproduce the problem from scratch (drugs?).

πŸ˜†

It would be great if you had a backup of the configuration of those problematic layouts. We could try to figure out what caused that issue, and then perhaps make it so that it doesn't happen for others.

Anyway, glad that my detailed steps helped you sort the issue out @mikesoltis. Let's close this issue for now, and we can reopen if it if anyone else reports the same in the future.

e0Re0R commented 6 months ago

Hi there, hate to bring this old chestnut up again - but I have found that not including the "Main page content" block triggers this behaviour for me. Here is a vanilla site pandp.giize.com which demonstrates this. (Login = Administrator, pass = 123456) There is a single page and a layout "IssueDemo". "Page1" is the menu link title, and "New page" is the page title. If you edit the layout to include a "Main page content" block the title of the page displays as New page (as expected). If you remove the "Main page content" block, the menu link title "Page1" is displayed as the page title. This happens whether you use the Page title, Page title combo blocks or the default Page title section.

Hope this helps.

klonos commented 6 months ago

Thanks @e0Re0R πŸ™πŸΌ

Lets re-open and look into it again then.

argiepiano commented 6 months ago

Hi @e0Re0R.

I've tested using your site (thanks for providing it!). I can see what you are describing, but I'm not sure this is a bug. I agree it's a confusing behavior. Perhaps this needs better documentation.

  1. When you use the "Main page content", the layout engine uses the node's title field as page title
  2. When you use field blocks (body for example) and don't use "Main page content", AND if you have enabled the "Provide menu link" option for the node, the layout engine will use the menu link text as the page title (see image below)
  3. And, when you use field blocks and don't use "Main page content", AND you disable the "Provide menu link", the node title is, again, used as the page title
Screen Shot 2024-05-03 at 7 26 10 PM

So, if you want to "provide a menu link", then you have to enter the text that matches the title of the node, in order for the layout to use that. Otherwise, disable the menu link option.

So, here's a question for contributors: is this a bug?

Sorry, I changed the layout and node in your site when testing!

argiepiano commented 6 months ago

A bit more information: when there is no layout override of node/% the node title is used as page title, even if the "provide menu link" text is different. So, perhaps, the behavior of the layout override should match this - use the node title as page title even when the "Main page content" block is not used.

klonos commented 6 months ago

So, here's a question for contributors: is this a bug?

πŸ€” ...it could be a UI/UX issue. I need to have a better look at this in order to suggest anything that might be useful. It could be possible to solve this as simply as providing some better help text, but it might need some further logic.

e0Re0R commented 6 months ago

Hi,

thanks for looking at this.

My use case is that I repeat one field at the top of the page and then again at the bottom. The quickest way I could see to do this was to use the field blocks. So it was totally unexpected to see the title coming from the menu link.

I can see the sense of using the menu link as a title when you are not using the main page content as there may not be any page content behind that layout.

Would it be possible to use the same logic that detects whether to list a "Main page content" block to provide a choice between Page title & Menu link within the Page title block options?

klonos commented 6 months ago

This issue here was brought up in this Zulip thread: https://backdrop.zulipchat.com/#narrow/stream/218635-Backdrop/topic/Custom.20Title.20for.20node.20layout/near/439125533