heading issues – causing accessibility issues

The support forum is open for members only. To add a topic or reply in the forum, please login or register.

Support Forum Moved
The Pojo Themes support has been transferred to a faster and more personal ticketing platform, so the forums are no longer active.
  • If you want to learn how to use Pojo themes, check out our extensive documentation guides.
  • Need help with using our themes? Contact us with a detailed explanation of your issue in the support page.
  • Have a pre-sale question or other inquiry? Feel free to contact us about it.

Support Forums Support (Legacy) heading issues – causing accessibility issues

This topic is: Resolved
Viewing 20 posts - 1 through 20 (of 22 total)
  • Author
    Posts
  • #1822

    Susan
    Participant

    I just saw that the headings on the homepage as you have them are not sequential as required by wcag guidelines
    the title on widgets is an h5 and within those headings are post sections are h2 an h3 headings – so how can I keep the look of the page and have the heading sections become h2 headings instead of h5
    on the text Inside JCH – is a title widget – how can I add the bar as you have it on your homepage – and as appears when the title is within the widget
    thanks

    #1831

    Boaz
    Keymaster

    For now there isn’t an option to control the widget’s headlines.
    But you can change it by adding a function to the function.php file.

    1. Make sure you are working with a child theme.
    2. add this lines of code to function.php file (you can change it to <h3> if you want):

    
    function pojo24475_setup_builder_widget_args( $args ) {
        $args['before_title'] = '<h2 class="pb-widget-title"><span>';
        $args['after_title'] = '</span></h2>';
        
        return $args;
    }
    add_filter( 'pb_empty_widget_args', 'pojo24475_setup_builder_widget_args' );
    #1836

    Susan
    Participant

    thanks. I am working with a child theme and i see that the way I am using the widgets and their titles – they will not always be h2 sometimes the title will be an h1
    can you send me the code to style the title with the heading as you have it with the rule for the h5
    I think it would be best to put the code within a stand alone title widget.
    Do you think that would work?ll

    #1847

    Boaz
    Keymaster

    I’m sorry, but i didn’t fully understand your meaning..
    What exactly would you like to do?

    #1856

    Susan
    Participant

    I would like to use the widget called title and then set my title headings there. But i still cannot figure out the code you use for the line after your headings example: the heading “popular” on http://demo.getpojo.com/buzz/home-4/ what code do you use there?

    #1864

    Boaz
    Keymaster

    We are using ::after selector with this CSS:

        background-color: transparent;
        content: '';
        display: block;
        height: 6px;
        margin-top: -3px;
        position: absolute;
        top: 50%;
        left: 100%;
        width: 10000%;
    #1874

    Susan
    Participant

    thanks for all your help – I put this code in my child theme style sheet but I am missing something – the line extends beyond the box
    Please advise – nothing I do seems to make it the correct size.

    Bridge page

    also all titles are problematic – is there any way to set the heading level of a widget title within the widget
    on this pagae all the story titles should really be h2

    thanks
    here is my css

    /* bridge page heading */
    h1.bridge

    {
    position: relative;
    display: inline-block;
    padding-right: 20px;
    line-height: 1;
    box-sizing: border-box;
    font-family: ‘Montserrat’, Arial, sans-serif;
    font-weight: bold;
    font-size: 15px;
    text-transform: uppercase;
    font-style: normal;
    box-sizing: border-box;
    }

    #jw
    {
    color: #004e70;
    }

    #jw:after
    {
    background-color: #004e70;
    }

    h1.bridge:after
    {
    background-color: transparent;
    content: ”;
    display: block;
    height: 6px;
    margin-top: -3px;
    position: absolute;
    top: 50%;
    left: 100%;
    width: 10000%;

    }

    #1882

    Boaz
    Keymaster

    You can try this:

    h1.bridge:after {
        width: 400%;
    }

    But i can’t tell you if it will be optimal in different resolutions.,

    #1886

    Susan
    Participant
    This reply has been marked as private.
    #1891

    Susan
    Participant

    overall the heading usage within the widgets is a bit of a mess – is there a way that I can set the heading on the title widgets and on the items within the widgets – this would be super helpful.

    #1900

    Boaz
    Keymaster

    There are two options:
    1. To change CSS until you get the wanted result.
    2. You can use Title/Heading widget for the headline, and in the widget that comes under it to disable the heading.

    #1901

    Boaz
    Keymaster

    You can also try to work with Elementor, our new builder.

    #1902

    Susan
    Participant

    I will keep at it. I spent a while on the css and did not get the desired result. I don’t understand #2 – as on the widget below I don’t use the heading and I looked in elementor and did not see that the options were any better. But I will keep trying! thanks

    #1906

    Susan
    Participant

    ok – some of my issues are resolved – the remaining issue is the title on an image is in the first item on this page
    http://dev.jewishcoffeehouse.com/ – I want to keep the look -but I don’t want to change the h4 to h2 in this case

    #1910

    Boaz
    Keymaster

    How did you change the rest of the titles? With the code i gave you?

    #1914

    Susan
    Participant

    no – i am using the wordpress text widget and setting the titles on the page that are not part of post widgets to h1 or h2 as needed. for posts – I did not want to do a global change to all post titles as some would be h2 and some h3 – a global change is not the perfect solution. Any ideas?

    #1918

    Boaz
    Keymaster

    So the only thing that isn’t good now is the heading of the main post?

    View post on imgur.com

    #1923

    Susan
    Participant

    yes that is correct -how can I fixe that to be an h1 or h2

    #1945

    Susan
    Participant

    the widget headings on the frame theme are also problematic -http://mevaser.tv/ – in the footer I am using widget headings – which are automatically h5 and within them are headings to posts which are automatically set to h3 – I put in the code that you sent for the buzz theme in the functions.php – but it does not work for the frame theme

    the code is
    function pojo24475_setup_builder_widget_args( $args ) {
    $args[‘before_title’] = ‘<h2 class=”pb-widget-title”><span>’;
    $args[‘after_title’] = ‘</span></h2>’;

    return $args;
    }
    add_filter( ‘pb_empty_widget_args’, ‘pojo24475_setup_builder_widget_args’ );

    #1954

    Boaz
    Keymaster
    This reply has been marked as private.
Viewing 20 posts - 1 through 20 (of 22 total)

The forum ‘Support (Legacy)’ is closed to new topics and replies.