Home Forums Weaver and Plugin Interaction gutenberg centering all page titles?

This topic contains 9 replies, has 4 voices, and was last updated by  scrambler 5 months, 3 weeks ago.

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #54839

    kiwimef
    Participant

    I have tried out the new gutenberg editor, so far so good. but all of a sudden all page titles of my blogs are centered, even those ones that were already there before i even installed gutenberg plugin. on blog page as well as on single pst pages. how can i set them back to left aligned or is that a default setting? same with the comments box, i want it all left aligned as before. when i deactivate gutenberg it’s all left aligned as before. but i would like to keep using gutenberg for new posts. not sure if this is controlled by weaver extreme or gutenberg …

    http://family.3kiwis.co.nz/?page_id=142

    also: when creating a new posts it says type your header, but that is actually the paget title and i cannot edit or fomat it.

    thanks,

    #54840

    Weaver
    Keymaster

    Everything is centered – not just the title, but the content as well. All this is due to the fact that the #container div has the class “center” added to it. I’m pretty sure Gutenberg doesn’t add that, but in fact, Gutenberg does define that class, while Weaver doesn’t. So that is why it goes away.

    You have checked the center option for the container, and the theme has its own definition of .center.

    Unfortunately, in a situation I will have to fix somehow, Gutenberg has its own CSS rule for center which overrides the theme’s version.

    Since weaver’s .center is added dynamically, I believe I can change the name to .wvr-center and that should fix things. This won’t be until Version 4 is released, and I’ll have to test it.

    #55065

    Marion
    Participant

    Is there a way to change the alignment of page/post titles to align left when using Gutenberg? The website I’m working on is fast-track-learning.com

    I’ve got everything flush-left except the page and post titles.

    #55066

    scrambler
    Moderator

    I am not following.

    Are you saying you want the titles under the images in each of the three column aligned left?

    Or are you speaking of some other pages, and if so which ones

    #55067

    Marion
    Participant

    No. The homepage is the only page that I want center alignment, it’s the main landing page. All the other posts and pages I want the post title to be left aligned. I have a lot of short lines and the layout looks weird when the post title is centered and everything else is flush left. I should have given you this link https://www.fast-track-learning.com/wordpress-from-zero-to-first-blog/

    #55068

    scrambler
    Moderator

    You have changed the page title position with the CSS+ rule

    .page-title {text-align:center;padding-bottom:.5em;;max-width:60%;margin-left:auto;margin-right:auto;margin-top:1em;}

    And you have changed the content position with the rule

    #content {} #content .entry-content{max-width:940px;margin-left:auto;margin-right:auto;padding-left:2%;padding-right:

    These are different so they don’t create any alignment.

    If these rules were meant for the home page only, then you need to remove them from the CSS+ boxes, change them to include the home page selector, and placed the full rules (see below) in the Theme Global Custom CSS Rule box

    .home .page-title {text-align:center;padding-bottom:.5em;;max-width:60%;margin-left:auto;margin-right:auto;margin-top:1em;}

    .home #content .entry-content {max-width:940px;margin-left:auto;margin-right:auto;padding-left:2%;padding-right:2%;}

    #55069

    Marion
    Participant

    I’m feeling quite stupid at the moment, Scrambler. I can’t find where the CSS+ rules are to remove them. I’ve looked in Appearance > Customize > Custom CSS > Global Custom CSS which contains:

    .single-post #header-image {display:none;}
    .single #title-tagline {display:none;}
    .content nav a {display:none;}
    a:hover, a:focus {
    color: #ff6600 !important;
    }
    h1 { font-weight:normal !important; color: }
    h2 { font-weight:normal !important; color: #0073aa; }
    h3 { font-weight:normal !important; color: #0073aa; }
    h4 { font-weight:normal !important; color: #0073aa; }
    h5 { font-weight:normal !important; color: #0073aa; }
    h6 { font-weight:normal !important; color: #0073aa; }
    .submit {
    font-family: Open Sans;
    color: #ffffff;
    font-size: 134% !important;
    text-decoration: none;
    text-shadow: 1px 1px 3px #666666 !important;
    background: -webkit-gradient(linear, 0 0, 0 100%, from(#ff854d), to(#e64900));
    padding: 5px 22px 5px 22px !important;
    border-radius: 8px !important;
    }
    .submit:hover {
    background: -webkit-gradient(linear, 0 0, 0 100%,
    from(#e64900), to(#ff854d));
    }
    .single .featured-image {
    display: none;
    }
    widget {font-size: 16px;}
    img.wp-post-image:hover{
    -webkit-transform: scale(1.1, 1.1);
    -moz-transform: scale(1.1, 1.1);
    -ms-transform: scale(1.1, 1.1);
    -o-transform: scale(1.1, 1.1);
    transform: scale(1.1, 1.1);
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    -ms-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    }
    #header {margin-bottom:0px;}
    .single .header {margin-bottom:0px !important;}

    I’m using Weaver Xtreme free version with Plain subtheme and the Gutenberg plugin.

    #55070

    Weaver
    Keymaster

    If you go to the legacy options (provided by the Weaver Xtreme Support plugin), and then find the Main Options, Content tab, you should find a “CSS+” option for the BG color of the Page Title. That is where scrambler found your title rule.

    And Gutenberg has nothing to do with styling a page or post title – that is all done by whatever theme you are using. Gutenberg’s styling and layout affects only the actual contents of pages or posts, and the theme still has a great deal of control (e.g., the way lists are presented, how Featured Images are placed, font family and size, and more).

    #55071

    Marion
    Participant

    You guys are brilliant. I must have done that a few years ago because I thought all my CSS modifications were in the customizer not in the legacy section.

    Thank you so much for your help.

    #55072

    scrambler
    Moderator

    The same CSS+ box are available both in legacy and customizer.

    The Post title BG CSS+ box is the same asĀ  Customize > Custom CSS > Post Specifics > Post Tile BG Custom CSS

Viewing 10 posts - 1 through 10 (of 10 total)

You must be logged in to reply to this topic.