ADA Compliance Imporvements

Your account expired support, please renew to get your support.

Renew support on the Envato Check the license on the Envato

Tagged: ADA

This topic has 3 replies, 2 voices, and was last updated 5 years, 2 months ago by Harry.

Viewing 3 reply threads

Save

Author

Posts

November 12, 2019 at 6:08 am #34402
knights
Support Expired
Would it be possible to integrate some additional features into the theme for ADA Compliance as that is becoming more and more important for websites (especially in the US).
1. Add additional fields to the Social Network sections of the Theme Options for each Social Account added. One field for “title” and one for “aria-label”.
2. Add “title” and “aria-label” for the Account Icon and Wishlist Icon and add “aria-label” for Search, Account, Wishlist and Cart.
3. For the WPBackery Page Builder when using the “Promotion Banner” would it be possible to add a link “title” and “aria-label” to the link options under the General tab.
Basically anything that can create a link to something else needs to have the “title” and should have the aria-label property for the link

Thanks for making a great theme.

November 12, 2019 at 7:17 am #34404

Harry

Support Expired

Hi Knight,

1, 2. Please add below code to claue-child > functions.php

if ( ! function_exists( 'jas_claue_social' ) ) {
	function jas_claue_social() {
		$output = '';

		$socials = cs_get_option( 'social-network' );
		if ( empty( $socials ) ) return;

		$output .= '<div class="jas-social">';
			foreach ( $socials as $social) {
				$output .= '<a class="dib br__50 tc ' . esc_attr( str_replace( 'fa fa-', '', $social['icon'] ) ) . '" href="' . esc_url( $social['link'] ) . '" target="_blank"><i class="' . esc_attr( $social['icon'] ) . '" title="' . esc_attr( $social['icon'] ) . '" aria-label="' . esc_attr( $social['icon'] ) . '"></i></a>';
			}
		$output .= '</div>';

		return apply_filters( 'jas_claue_social', $output );
	}
}

if ( ! function_exists( 'jas_claue_wc_my_account' ) ) {
	function jas_claue_wc_my_account() {
		$output = '';

		if ( cs_get_option( 'header-my-account-icon' ) ) {
			$output .= '<div class="jas-my-account hidden-xs ts__05 pr">';
				$output .= '<a class="cb chp db" href="' . esc_url( get_permalink( get_option( 'woocommerce_myaccount_page_id' ) ) ) . '" title="My Account" aria-label="My Account"><i class="pe-7s-user"></i></a>';
				$output .= '<ul class="pa tc">';
					if ( is_user_logged_in() ) {
						$output .= '<li><a class="db cg chp" href="' . esc_url( get_permalink( get_option( 'woocommerce_myaccount_page_id' ) ) ) . '">' . esc_html__( 'Dashboard', 'claue' ) . '</a></li>';
						$output .= '<li><a class="db cg chp" href="' . esc_url( home_url( '/orders-tracking/' ) ) . '">' . esc_html__( 'Order Tracking', 'claue' ) . '</a></li>';
						$output .= '<li><a class="db cg chp" href="' . esc_url( wp_logout_url() ) . '">' . esc_html__( 'Logout', 'claue' ) . '</a></li>';
					} else {
						$output .= '<li><a class="db cg chp" href="' . esc_url( get_permalink( get_option( 'woocommerce_myaccount_page_id' ) ) ) . '">' . esc_html__( 'Login / Register', 'claue' ) . '</a></li>';
					}
				$output .= '</ul>';
			$output .= '</div>';
		}

		return apply_filters( 'jas_claue_wc_my_account', $output );
	}
}

if ( ! function_exists( 'jas_claue_wc_shopping_cart' ) ) {
	function jas_claue_wc_shopping_cart() {
		global $woocommerce;
		
		// Catalog mode
		$catalog_mode = cs_get_option( 'wc-catalog' );

		if ( $catalog_mode ) return;

		$output = '';
		$output .= '<div class="jas-icon-cart pr">';
			$output .= '<a class="cart-contents pr cb chp db" href="#" title="' . esc_html( 'View your shopping cart', 'claue' ) . '" aria-label="' . esc_html( 'View your shopping cart', 'claue' ) . '">';
				$output .= '<i class="pe-7s-shopbag"></i>';
				$output .= '<span class="pa count bgb br__50 cw tc">' . esc_html( $woocommerce->cart->get_cart_contents_count() ) . '</span>';
			$output .= '</a>';
		$output .= '</div>';
		return apply_filters( 'jas_claue_wc_shopping_cart', $output );
	}
}

and copy layout-x.php in claue > views > header to claue-child > views > header and add title and arial-label for search icon and wishlist icon

3. Please edit file promotion.php in plugins > claue-addons > includes > shortcodes

Kind regards

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

November 12, 2019 at 7:46 am #34405

knights
Support Expired

I an using the Gecko theme would I need to change the reference in the functions additions you provided ?

November 12, 2019 at 7:29 pm #34412

Harry

Support Expired

1,2. Sorry, please change code to

if ( ! function_exists( 'jas_gecko_social' ) ) {
    function jas_gecko_social() {
        $output = '';

        $socials = cs_get_option( 'social-network' );
        if ( empty( $socials ) ) return;

        $output .= '<div class="jas-socials">';
            foreach ( $socials as $social) {
                $output .= '<a class="dib br__50 tc ' . esc_attr( str_replace( 'fa fa-', '', $social['icon'] ) ) . '" href="' . esc_url( $social['link'] ) . '" target="_blank"><i class="' . esc_attr( $social['icon'] ) . '" title="' . esc_attr( $social['icon'] ) . '" aria-label="' . esc_attr( $social['icon'] ) . '"></i></a>';
            }
        $output .= '</div>';

        return apply_filters( 'jas_gecko_social', $output );
    }
}

if ( ! function_exists( 'jas_gecko_wc_my_account' ) ) {
    function jas_gecko_wc_my_account() {
        $output = '';

        if ( cs_get_option( 'header-my-account-icon' ) ) {
            $output .= '<div class="jas-my-account hidden-xs ts__05 pr">';
                $output .= '<a class="cb chp db" href="' . esc_url( get_permalink( get_option( 'woocommerce_myaccount_page_id' ) ) ) . '" title="My Account" aria-label="My Account"><i class="pe-7s-user"></i></a>';
                $output .= '<ul class="pa tc">';
                    if ( is_user_logged_in() ) {
                        $output .= '<li><a class="db cg chp" href="' . esc_url( get_permalink( get_option( 'woocommerce_myaccount_page_id' ) ) ) . '">' . esc_html__( 'My Account', 'gecko' ) . '</a></li>';
                        $output .= '<li><a class="db cg chp" href="' . esc_url( wp_logout_url() ) . '">' . esc_html__( 'Logout', 'gecko' ) . '</a></li>';
                    } else {
                        $output .= '<li><a class="db cg chp" href="' . esc_url( get_permalink( get_option( 'woocommerce_myaccount_page_id' ) ) ) . '">' . esc_html__( 'Login / Register', 'gecko' ) . '</a></li>';
                    }
                $output .= '</ul>';
            $output .= '</div>';
        }

        return apply_filters( 'jas_gecko_wc_my_account', $output );
    }
}

if ( ! function_exists( 'jas_gecko_wc_shopping_cart' ) ) {
    function jas_gecko_wc_shopping_cart() {
        global $woocommerce;
        
        // Catalog mode
        $catalog_mode = cs_get_option( 'wc-catalog' );

        if ( $catalog_mode ) return;

        $output = '';
        $output .= '<div class="jas-icon-cart pr">';
            $output .= '<a class="cart-contents pr cb chp db" href="#" title="' . esc_html( 'View your shopping cart', 'gecko' ) . '" aria-label="' . esc_html( 'View your shopping cart', 'gecko' ) . '">';
                $output .= '<i class="pe-7s-shopbag"></i>';
                $output .= '<span class="pa count bgb br__50 cw tc">' . wp_kses_post( $woocommerce->cart->get_cart_contents_count() ) . '</span>';
            $output .= '</a>';
        $output .= '</div>';
        return apply_filters( 'jas_gecko_wc_shopping_cart', $output );
    }
}

and copy layout-x.php in gecko > views > header to gecko-child > views > header and add title and arial-label for search icon and wishlist icon

3. Please edit file promotion.php in plugins > jas-addons > includes > shortcodes

Kind regards

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

Author

Posts

Viewing 3 reply threads

Save

You must be logged in to reply to this topic.

Menu

Support Forum