WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] [closed] [twenty-eleven] is it possible to center specific page titles? (8 posts)

  1. savedave
    Member
    Posted 1 year ago #

    Hi everyone

    Thanks so much to everyone for helping with this.

    I would like to center the page title on some of my pages. I have read various forum posts offering CSS for the style sheet to center all titles, but I really only want to center titles on a few specific pages.

    Is this at all possible? Is there a text editor for titles the same way as there is for content - or a place where I could enter a tag on the title?

    As an example, I would like to center the word commercials here: http://nadaav.com/n/films/commercials/

    But I do not want to center the words Get In Touch here: http://nadaav.com/n/contact/

    Is this possible?

    thanks kindly

    SD

  2. Andrew
    Forum Moderator
    Posted 1 year ago #

    - View your webpage.
    - Right click where applicable.
    - Select 'View source'.

    - Look for the <body> element.
    - Look at its classes.

    You should be able to find a class that uniquely identifies particular pages.

    Then you can use those classes to apply styles to particular pages.

  3. savedave
    Member
    Posted 1 year ago #

    Thanks for your reply.

    On chrome I did 'inspect element' but it just tells me:
    <h1 class="entry-title">Commercials & Brand Films</h1>

    If I understand correctly, the class is "entry-title" and it's not unique to this page. Changing that would, I believe, change all page titles, not just this one.

    Is that correct?

    thanks

  4. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    You need to find the page-specific class which is in the body tag - for example on that page:

    <body class="page page-id-8 page-child parent-pageid-6 page-template-default custom-background single-author singular two-column right-sidebar">

    So then you can use that in the CSS:

    .page-id-8 h1.entry-title {
       text-align: center;
    }
  5. savedave
    Member
    Posted 1 year ago #

    Oh I see. that is AMAZING! I didnt really understand how to use the inspect element function - still dont really but this is great.

    WPyogi if you come to London I owe you a massive beer for your continued help!

    :)

  6. savedave
    Member
    Posted 1 year ago #

    And thank you Andrew too! A pot of earl grey to you.

  7. square_eyes
    Member
    Posted 8 months ago #

    This was really helpful thanks. Can you tell me if there is an easier way than to list each page separately?

    Say in the same css class statement, having a list of page IDs?

    Sorry I'm new to CSS.

  8. square_eyes
    Member
    Posted 8 months ago #

    Spoke too soon. I found this over at Stack Overflow.

    Here is what I used:

    /* Custom Page h1 Styling by ID */
    .page-id-50 h1.entry-title, .page-id-51 h1.entry-title {
      text-align: center;
    }

    I only listed two in this example but I assume there is no limit.

Topic Closed

This topic has been closed to new replies.

About this Topic