Change the default page template in Oceanica Child theme

[Lok Cheung]

Hi,

I use Oceanica Child theme with the Hotel Booking plugin, for adding a new page I can select a page template like “Full width” or “Front page” etc. But when showing details of an Accommodation Type from the Hotel plugin, it always uses the default page template e.g. “Page with sidebar” and there is no where that I can change this default setting, or define a page template for the Hotel plugin. Any help and advice?

Thanks.

[J. Davis]

Hi Lok,

You can modify layout of accommodation type page by copying single.php file from parent theme to child one and changing it name to single-mphb_room_type.php. Then edit this file by removing sidebar and editing content wrapper classes to make it full width.

best regards,
John

[Lok Cheung]

Thanks, John. Since I am using a cloud service provider to host my website, they allow me to install plugins and themes but may not allow me to copy or edit .php files. Any further advice? Thank you for your help. -Lok

[J. Davis]

Hi Lok,

If you can install theme you can prepare your Child Theme locally creating file and editing it. And then install it to your WordPress.
Do you only need to remove sidebar from accommodation page?

Best regards,
John

[Lok Cheung]

Thank you for your speedy response. Will try to do it locally.
Yes, actually I just want the Blog section having sidebar, others are all in full width e.g. Home, Accommodation, Search Availability, Booking etc.

Thanks and regards,
-Lok

[J. Davis]

Hi Lok,

You can try adding this file even to your parent theme to remove sidebar from accommodation post type page.
As for others pages you mentioned you can select Full Width page template.

best regards,
John

[Lok Cheung]

Hi John,

Thanks so much for your help. Will try and test it on my computer.

We use Oceanica theme because of its responsive web design, e.g. mobile device friendly, however including sidebar on some pages, e.g. accommodations or booking, may complicate the user interface if it doesn’t allow to select templates.

I also notice that, when using Full Width template to display photo gallery of an accommodation type, the main photo is shown in left-aligned instead of center-aligned, but I am not sure if it relates to the Oceanica theme or the Hotel Booking plugin. Thanks.

Regards,
-Lok

[J. Davis]

Hi Lok,

Please try to use third party plugin that allows to regenerate thumbnails or use bigger image with width that is equal or bigger then page width.

best regards,
John

[Lok Cheung]

Thanks, John. Your single-mphb_room_type.php file works fine when displaying room type details, but it didn’t take effect in displaying Categories and Amenities, that is it still shows the sidebar. Do I need to create separate files for them?

Thanks and regards,

-Lok

[J. Davis]

Hi Lok,

Those are archive pages and in order to override it and modify its layout you should copy archive.php file from Parent theme to Child one. Then open it to edit. There you will need to remove the following line to get rid of sidebar:

< ?php get_sidebar(); ?>

Then find the line below in this file

<div id="primary" class="content-area">

and replace it with this one

<div id="primary" class="content-area full-width">

Thus we added class from full width page layouts of this theme that increases width of page. Feel free to use your custom classes.

It is possible to get our personal assistance to customize theme layouts with Extended Support offer.

best regards,
John

[Lok Cheung]

Many thanks, John.

Regards,
-Lok

[Lok Cheung]

Hi John,

I notice that if I insert a tel:xxxx link onto the header area, it will show a little telephone icon in front of the phone number, it is very good. How about if I put on a mailto:xxxx link? Could it be possible to show a little mailbox icon as well?

Thanks and regards,
-Lok

[J. Davis]

Hi Lok,

There are used Font Awesome icons and there is just icon of envelope that reminds mail. Thus you can apply the style below for it to appear for Header Left Menu location:

.theme-social-menu a[href*="mailto:"]:before{
	content:'\f0e0';
}

If you need an icon of mailbox than you can use url('/wp-content/uploads/...') property instead of font awesome icon unicode and show your image icon of mailbox.

best regards,
John

[Lok Cheung]

Perfect, envelope is actually what I want. Thank you so much!

Regards,
-Lok

[Author]

Posts