How do i hide the page name in touch ui sites.html

[codingStar]

Hi,

I am using AEM 6.2.0 SP1,

I have create pages for my website but when i view these page in

http://localhost:4502/sites.html/content/mywebsite

both the name and the tile of page visible.

How do i hide page name (refer above image the highlighted section)??

[kautuk_sahni]

Hi,

What is the use-case of not showing them? Author can anyways see them while editing the page properties.

edubey Any help here?

~kautuk

[codingStar]

Its client requirement, they don't want to visible  both Name and Title.

Is there any way we can hide page name?

[kautuk_sahni]

If it is just forsake of hiding, you can do it by making CSS

.foundation-collection-item-title

{visibility:hidden;}

CSS:- /libs/granite/ui/components/coral/foundation/clientlibs/foundation/css/layout/columnview.css

I would recommend you to extend (create a parallel in apps) the CSS rather than editing the original CSS

PS:- If any changes made in CSS/JS are not getting reflected then do clear the browser cache. Still problem persist then go ahead and Delete project specific folder under /var/clientlibs/...

~kautuk

[codingStar]

Hi,

I did not find this file

/libs/granite/ui/components/coral/foundation/clientlibs/foundation/css/layout/columnview.css

in crx/de.

I am using AEM 6.2.0 SP1.

[kautuk_sahni]

The Solution provided was for AEM 6.3.

Testing it on AEM 6.2 is not showing page Title therefore CSS file dose not exist.

Do not have 6.2.0 SP1 build  right now to test.

What I would recommend you here is that to Inspect the element that you would like to hide and also check the path of CSS for that. Correspondingly in CRX/DE find the file.

~kautuk

[edubey]

Hi codingStar,

You are not able to see because file on pages are loaded after they are combined.

This is the file /libs/granite/ui/components/coral/foundation/clientlibs/foundation/css/layout/util.css and look for class ".foundation-layout-util-subtletext" and add display:none

like below

.foundation-layout-util-subtletext {

    color: #969696;

display:none;

}

Thanks