Forum Replies Created

Viewing 15 replies - 1 through 15 (of 42 total)
  • Thread Starter Bookman53

    (@bookman53)

    When I wrote the original post here, I could simply hide the bread crumbs and the problem would go away. I could have just an empty Row Layout under the header and the problem would be there. When I removed the Row Layout, the menus in the header returned to normal.

    Then, for some reason that I can’t explain, both of those situations stopped affecting the height of the menus in the header. In all configurations, the navigation rows were too tall.

    I saw the CSS that you found, but could not find where it came from. I did not set it myself. After a long time of searching for the source of it, I decided to Google that piece of CSS.

    I discovered that this was a known issue with the WordPress block builder. Apparently, when a background color is set in a block that contains ol or ul items, WordPress automatically adds the following CSS to the CSS file that pertains to list items.

    ol.has-background, ul.has-background { padding: 1.25em 2.375em; } 

    You can read more about it here: https://github.com/WordPress/gutenberg/issues/30725 https://github.com/WordPress/gutenberg/issues/36586

    I finally figured out a way around the problem. That is, don’t set a background color for a block that contains ol or ul, such as navigation blocks. Instead, set the background to transparent and let the parent block control the background color.

    For example:

    Row layout: Set background color.

    Section: Do not set background color.

    Navigation: Do not set background color.

    This is probably not a fix for everyone, but it worked for me.

    This has never been an issue for me until the recent updates to WordPress and the Twenty-Twenty-Two theme. Suddenly, whatever had been overriding that CSS no longer works.

    It would be nice if Kadence could build in a way to override the extra padding that WordPress adds when a background color is set to blocks that contain ol or ul items such as this case with a navigation block.

    Thank you.

    • This reply was modified 1 year, 4 months ago by Bookman53.
    Thread Starter Bookman53

    (@bookman53)

    You can the problem on this page (or any post). https://thetechiesenior.com/can-google-docs-alphabetize/

    To see what it should look like, just navigate to the Home page, About Us, Contact, etc..

    There is no Customize under the Appearance menu. As stated earlier, this site is built from scratch from blocks using Twenty Twenty-Two. There is nothing under the Appearance menu but Themes and Edit.

    Regarding setting the breadcrumb engine, I feel sure that cannot be the problem because the problem happens if nothing else but an empty Kadence Row Layout is inserted below the header. Even without a shortcode block (and therefore, no RankMath breadcrumb shortcode) the problem happens.

    It seems that the empty Row Layout is causing there to be additional vertical padding added to both menu rows in the header.

    Again, even an empty Row Layout block added below the header causes the additional padding in the header menu rows.

    This problem only began with the WordPress 6.4.1, Twenty Twenty-Two theme 1.6, and Kadence Blocks 3.1.24 updates.

    Thread Starter Bookman53

    (@bookman53)

    As an additional note, the only CSS that is affected by this issue is the top and bottom padding in the menu rows. The menu rows appear to be picking up the top and bottom padding from the row below the header that contains the shortcode block. Background color, width, etc. are not changed in the menu rows.

    Thread Starter Bookman53

    (@bookman53)

    Is there an update?

    Thread Starter Bookman53

    (@bookman53)

    Is there anyone who can reply to this request?

    Thread Starter Bookman53

    (@bookman53)

    I installed the Health Check and Troubleshooting plugin and after testing for quite a while, narrowed it down to the EditorsKit plugin. Even with all other plugins disabled, if EditorsKit is active, the post is missing from the category page. If I disable EditorsKit, the post shows up on the category as it should.

    I have submitted a ticket EditorsKit to see if they have any idea why it’s conflicting.

    Thread Starter Bookman53

    (@bookman53)

    <!-- wp:kadence/rowlayout {"uniqueID":"_c65b1b-93","columns":3,"colLayout":"center-exwide","maxWidth":1200,"align":"center","firstColumnWidth":10,"secondColumnWidth":80,"kbVersion":2,"kadenceBlockCSS":"selector {\n  z-index: 0;\n\n}"} -->
    <!-- wp:kadence/column {"borderWidth":["","","",""],"uniqueID":"_a5ceeb-fb","borderStyle":[{"top":["","",""],"right":["","",""],"bottom":["","",""],"left":["","",""],"unit":"px"}],"className":"inner-column-1"} -->
    <div class="wp-block-kadence-column kadence-column_a5ceeb-fb inner-column-1"><div class="kt-inside-inner-col"></div></div>
    <!-- /wp:kadence/column -->
    
    <!-- wp:kadence/column {"id":2,"borderWidth":["","","",""],"uniqueID":"_e39de7-db","borderStyle":[{"top":["","",""],"right":["","",""],"bottom":["","",""],"left":["","",""],"unit":"px"}],"className":"inner-column-2"} -->
    <div class="wp-block-kadence-column kadence-column_e39de7-db inner-column-2"><div class="kt-inside-inner-col"><!-- wp:kadence/spacer {"spacerHeight":72,"dividerColor":"#e27d60","dividerHeight":4,"uniqueID":"_94ad29-f4"} -->
    <div class="wp-block-kadence-spacer aligncenter kt-block-spacer-_94ad29-f4"><div class="kt-block-spacer kt-block-spacer-halign-center"><hr class="kt-divider"/></div></div>
    <!-- /wp:kadence/spacer -->
    
    <!-- wp:query {"queryId":196,"query":{"perPage":"10","pages":0,"offset":0,"postType":"post","order":"desc","orderBy":"date","author":"","search":"","exclude":[],"sticky":"","inherit":true},"displayLayout":{"type":"list"},"align":"wide","layout":{"inherit":true,"type":"constrained"}} -->
    <div class="wp-block-query alignwide"><!-- wp:post-template {"align":"wide"} -->
    <!-- wp:columns -->
    <div class="wp-block-columns"><!-- wp:column {"width":"33.33%"} -->
    <div class="wp-block-column" style="flex-basis:33.33%"><!-- wp:post-featured-image {"isLink":true,"className":"tw-img-ratio-3-2"} /--></div>
    <!-- /wp:column -->
    
    <!-- wp:column {"verticalAlignment":"center","width":"66.66%"} -->
    <div class="wp-block-column is-vertically-aligned-center" style="flex-basis:66.66%"><!-- wp:post-title {"isLink":true,"style":{"spacing":{"margin":{"bottom":"20px"}},"color":{"text":"#00000099"}},"className":"tw-link-hover-underline","fontSize":"large","fontFamily":"tw-font-1"} /-->
    
    <!-- wp:post-excerpt {"moreText":"Continue this article...","style":{"spacing":{"margin":{"bottom":"1.25rem"}}},"twExcerptLength":30} /-->
    
    <!-- wp:group {"style":{"spacing":{"blockGap":"7px"}},"layout":{"type":"flex","allowOrientation":false}} -->
    <div class="wp-block-group"><!-- wp:post-date {"format":"","style":{"typography":{"fontSize":"0.875rem"}}} /-->
    
    <!-- wp:paragraph {"style":{"typography":{"fontSize":"0.875rem"}}} -->
    <p style="font-size:0.875rem">·</p>
    <!-- /wp:paragraph -->
    
    <!-- wp:post-terms {"term":"category","style":{"typography":{"fontSize":"0.875rem"}},"className":"tw-link-hover-underline"} /--></div>
    <!-- /wp:group --></div>
    <!-- /wp:column --></div>
    <!-- /wp:columns -->
    
    <!-- wp:separator {"opacity":"css","className":"tw-mb-6 tw-mt-6 is-style-wide"} -->
    <hr class="wp-block-separator has-css-opacity tw-mb-6 tw-mt-6 is-style-wide"/>
    <!-- /wp:separator -->
    <!-- /wp:post-template -->
    
    <!-- wp:query-pagination {"paginationArrow":"chevron","align":"wide","className":"tw-mt-7","layout":{"type":"flex","justifyContent":"space-between","orientation":"horizontal"}} -->
    <!-- wp:query-pagination-previous {"label":"Previous"} /-->
    
    <!-- wp:query-pagination-numbers /-->
    
    <!-- wp:query-pagination-next {"label":"Next"} /-->
    <!-- /wp:query-pagination --></div>
    <!-- /wp:query --></div></div>
    <!-- /wp:kadence/column -->
    
    <!-- wp:kadence/column {"id":3,"borderWidth":["","","",""],"uniqueID":"_f98320-ad","borderStyle":[{"top":["","",""],"right":["","",""],"bottom":["","",""],"left":["","",""],"unit":"px"}],"className":"inner-column-3"} -->
    <div class="wp-block-kadence-column kadence-column_f98320-ad inner-column-3"><div class="kt-inside-inner-col"></div></div>
    <!-- /wp:kadence/column -->
    <!-- /wp:kadence/rowlayout -->
    Thread Starter Bookman53

    (@bookman53)

    <!-- wp:template-part {"slug":"header","theme":"twentytwentytwo"} /-->
    
    <!-- wp:group {"style":{"typography":{"fontSize":"22px"}},"className":"has-tw-font-1-font-family","layout":{"inherit":true,"type":"constrained"}} -->
    <div class="wp-block-group has-tw-font-1-font-family" style="font-size:22px"><!-- wp:kadence/rowlayout {"uniqueID":"_7a2c84-82","columns":1,"colLayout":"equal","align":"wide","vsmobile":true,"kbVersion":2,"kadenceBlockCSS":"selector {\n  z-index: 0;\n\n}"} -->
    <!-- wp:kadence/column {"borderWidth":["","","",""],"uniqueID":"_d3db38-63","padding":[0,"",0,""],"margin":[0,"",0,""],"borderStyle":[{"top":["","",""],"right":["","",""],"bottom":["","",""],"left":["","",""],"unit":"px"}],"className":"inner-column-1"} -->
    <div class="wp-block-kadence-column kadence-column_d3db38-63 inner-column-1"><div class="kt-inside-inner-col"><!-- wp:query-title {"type":"archive","showPrefix":false,"align":"wide","style":{"typography":{"fontSize":"48px","fontStyle":"normal","fontWeight":"500"},"spacing":{"margin":{"bottom":"6px"}},"color":{"text":"#00000099"}},"className":"tw-prefix-hidden","fontFamily":"tw-font-1"} /--></div></div>
    <!-- /wp:kadence/column -->
    <!-- /wp:kadence/rowlayout -->
    
    <!-- wp:kadence/rowlayout {"uniqueID":"_f491da-1b","columns":1,"colLayout":"equal","align":"wide","vsdesk":true,"vstablet":true,"kbVersion":2,"kadenceBlockCSS":"selector {\n  z-index: 0;\n\n}"} -->
    <!-- wp:kadence/column {"borderWidth":["","","",""],"uniqueID":"_680ee3-4e","padding":[0,"",0,""],"margin":[0,"",0,""],"borderStyle":[{"top":["","",""],"right":["","",""],"bottom":["","",""],"left":["","",""],"unit":"px"}],"className":"inner-column-1"} -->
    <div class="wp-block-kadence-column kadence-column_680ee3-4e inner-column-1"><div class="kt-inside-inner-col"><!-- wp:query-title {"type":"archive","showPrefix":false,"align":"wide","style":{"typography":{"fontSize":"38px","fontStyle":"normal","fontWeight":"500"},"spacing":{"margin":{"bottom":"6px"}},"color":{"text":"#00000099"}},"className":"tw-prefix-hidden","fontFamily":"tw-font-1"} /--></div></div>
    <!-- /wp:kadence/column -->
    <!-- /wp:kadence/rowlayout -->
    
    <!-- wp:term-description {"style":{"spacing":{"padding":{"left":"0","bottom":"0"},"margin":{"bottom":"0"}}},"fontFamily":"tw-font-1"} /-->
    
    <!-- wp:template-part {"slug":"archive-and-search-body-layout","theme":"twentytwentytwo","align":"wide"} /--></div>
    <!-- /wp:group -->
    
    <!-- wp:template-part {"slug":"footer-wide-center-column","theme":"twentytwentytwo"} /-->

    I deactivated Twentig. Nothing changed, so I’ve pasted in the code from the archive template.

    • This reply was modified 1 year, 11 months ago by Bookman53.
    Thread Starter Bookman53

    (@bookman53)

    Thanks. Perhaps you will be able to support site editing in a future update.

    Thread Starter Bookman53

    (@bookman53)

    Yes, “Special Characters” is checked (enabled) in the Editorskit settings.

    I just went back and double-checked. I discovered something that I hadn’t before.

    Special characters is available while writing or editing posts. But it is not available in standard paragraph blocks in the Template editor.

    I have tried paragraph blocks by themselves. I have tried typing special characters inside paragraph blocks in standard rows and inside Kadence block rows.

    I cannot get special characters to work anywhere inside the template editor.

    The particular situation where I tried to use special characters was in a block inside a custom homepage layout. I was able to insert the TM character by using the HTML entity name for it.

    Thread Starter Bookman53

    (@bookman53)

    I have replaced the TOC with a different plugin.

    Thank you.

    Thread Starter Bookman53

    (@bookman53)

    Regarding my earlier comment about there being no anchors in the heading tags, apparently the TOC block uses some other method because there are none in the desktop or mobile devices, yet it works in desktop and not in mobile.

    Thread Starter Bookman53

    (@bookman53)

    I removed the TOC block from the reusable block and reinserted it. The TOC started working on desktop, but still doesn’t on mobile.

    Thread Starter Bookman53

    (@bookman53)

    I am inserting the block as a reusable block so the block will maintain the styling. Could that cause the issue?

    Thread Starter Bookman53

    (@bookman53)

    PS: By the question, shouldn’t there be anchors for the headings, I meant shouldn’t they have been placed automatically by the plugin?

Viewing 15 replies - 1 through 15 (of 42 total)