Hi Maryanne,

The issue is caused by some pages that don't have a page title name. Please navigate to the Pages tab from the WordPress admin menu and you will see 3 pages that has "(no title)" as page name. Please click on each of these pages and give them a page name. 

That should fix the issue.

Hi Maryanne,

In that case I think it's better to give the unnamed pages a title and then remove them from the submenu via Appearance -> Menu's -> Main Navigation.

If you would like to add a custom link to the submenu where the menu item links to a specific part of the page you can add a "Custom Link" to the menu structure where you can give the item a custom name and url.

The submenu item with the # and page id title can be removed there from the menu structure.

Please see the attached images

Hi Maryanne,

If you don't want to display those links in the submenu please navigate to Appearance -> Menu's and select the "Main Navigation" from the select field on that page. Here you can click on the link panels and press delete to remove them from the menu/submenu (see attached screenshot). In this area you can control the navigation of the theme.

"Screenshot(162).png",
"services_drop_down_menu_problems.png"
See above paragraph to remove these links from the submenu

"service_page_linking_issues.png"
Texts already link to the specific page on http://www.posturechiro.com.au/services/

If you have any questions please let me know. I hope you get well soon

Hi Maryanne,

There is no such thing as an editor for different screen types (responsive editor), but I can help you with this.

Please add the following css snippets to Appearance -> Customize -> Theme Options -> Custom CSS

Slide captions on image

/* Captions on slide image */
@media (max-width: 992px) {
    .jumbotron .jumbotron-caption { position: absolute; bottom: 0; }
    .jumbotron .jumbotron-caption .caption-heading h1 { font-size: 24px; }
}

Reduce call to action button size

/* Reduce cta btn size */
@media (max-width: 992px) {
    .header .header-wrapper .featured-button a { padding: 5px 10px; }
}

By default the button will be full width, if you would like to remove that please add the following code instead:

/* Reduce cta btn size */
@media (max-width: 992px) {
    .header .header-wrapper .featured-button a { display: inline-block; padding: 5px 10px; }
}

Mobile logo size

/* Increase mobile logo size */
@media (max-width: 992px) {
    .header .header-wrapper .header-logo img { width: 120px; }
}

Please change the default 120px value to your own needs

Unwanted white space

Currently the "Header" widget area under Appearance -> Widgets contain 3 empty "QT: Icon Box" widgets which create this white space. Please delete the widgets and the white space is removed

Hi Maryanne,

Most of the popular page builders for WordPress does not have an editor for different screen types. As far as I know the Elementor page builder is the first page builder that have a function like this and which developers can use in their commercial themes.

If you woud like change elements the from page builder elements in the theme for different screen types you would need to add custom classes to these elements and then target these classes with custom css to change it for the specific screen type. If you edit the widget you can add a "custom class" in the "Attributes" panel of the modal.

"reduce_text_size_on_HOME_for_mobile.png"
Please add "reduce-quote-size" (without " ") in the widget class input field of the widget that contain these texts and then add the following css to Appearance -> Customize -> Theme Options -> Custom CSS:

/* Reduce quote size homepage */
@media (max-width: 992px) {
    .reduce-quote-size h2 {
        font-size: 24px;
    }
}

You can change the 24px size to your own needs

"change_image_size_and_placement_ABOUT_page.png"
Unfortunately it is not possible to change the image size per screen, WordPress does only provide 1 image size. But you can adjust the width of the image with css. Add "change-image-size" (without " ") in the widget input field of this widget and add the following css:

/* Adjust image width */
@media (max-width: 992px) {
    .change-image-size img {
        width: 100%;
    }
}

Below the texts of the "growing up in China.." paragraph there is an empty paragraph which create this gap. Please edit the widget that contain these texts, click the "Text" tab (next to the visual tab) and remove the empty <p> tag.

To change the text size of the tab. Add the widget class "change-paragraph-size" (without " ") and add the following css:

/* Adjust paragraph size */
@media (max-width: 992px) {
    .change-paragraph-size p {
        font-size: 16px;
    }
}

"remove_white_space_content.png"
Add the following css in to the theme customizer:

/* Adjust botto margin content */
@media (max-width: 992px) {
    .content-area { margin-bottom: 20px; }
}

You can change the 20px value to your own needs

"reduce_wasted_space_on_footer_for_mobile_view.png"

1. Reduce top footer space:

/* Adjust top footer padding */
@media (max-width: 992px) {
    .footer .footer--top { padding-top: 0; }
}

2. Icon box text size:

/* Adjust top footer icon box text size */
@media (max-width: 992px) {
    .footer .icon-box--description { text-size: 14px; }
}

3. Bottom footer padding:

/* Adjust bottom footer padding */
@media (max-width: 992px) {
    .footer .footer--bottom { padding: 10px 0; }
}

You're welcome

Yes is possible with the same principle. If you add a custom class to the widget that contain the image you can target the class with css to hide it for a particular screen size.

For example if you add the custom class hide-image in the widget class input field and then add the following in the theme customizer custom css panel:

/* Hide element on mobile */
@media (max-width: 992px) {
    .hide-image {
        display: none;
    }
}

Please note that above will hide the entire widget so if there is an image and some text within the same widget that have the hide-image class it will both be removed.

Side note: From the source code of your website I see there are some changes been made to the theme stylesheet (style.css file). Please note that it is not recommend to made any changes to the template files directly. These changes will be overwritten when you update the theme. To add css always use the custom css panel in the theme customizer, this area will not be overwritten on theme updates.

Thank you! Have a great weekend too