Configuring Features in Webium Pro Theme

The Webium Pro theme has several built-in features that can be easily customized. Basically, those features are anything that includes functionality in the theme.

Lazy Loading AdSense

This setting is useful for delaying the loading of the AdSense script which of course will affect the speed or performance of the page. Here are some steps to customize it:

1. Go to Blogger Dashboard, select the Theme menu.
2. Click the CUSTOMIZE button.
3. Click Advanced Dropdown, click Default Options Dropdown and Select Feature Options.
4. Look for the Slider setting named Lazy Loading AdSense (Disable | Enable), drag the slider right or left. Here is the explanation:
   • 1px: Disable - Lazy Loading AdSense will be disabled.
   • 2px: Enable - Lazy Loading AdSense will be enabled.
5. Click the Save button (diskette icon) in the lower right corner.

Attention!

• If you enable this feature, then you must also set AdSense ID and AdSense Delay Duration (Optional).
• One of the advantages of this feature is that it speeds up page loading. We don't know exactly how this feature will impact your AdSense earnings. So, it all depends on your wishes.

AdSense Ad Code Installation Guide

If you want to place AdSense ads using the script provided by Google AdSense. Make sure you don't include script tags into your HTML/JavaScript widget. Here is an example:

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-xxxxxx"
     crossorigin="anonymous"></script>

<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-xxxxxx"
     data-ad-slot="xxxxxx"
     data-ad-format="auto"
     data-full-width-responsive="true"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script>

Copy and paste only the following code:

<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-xxxxxx"
     data-ad-slot="xxxxxx"
     data-ad-format="auto"
     data-full-width-responsive="true"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script>

It is highly recommended to install the AdSense ad code through the AdSense Widget provided by Blogger.

Adding AdSenseID

This setting is only useful if you have enable Lazy Loading AdSense feature.

1. Go to Blogger Dashboard, select the Layout menu.
2. Look for the section titled Theme Panel Top.
3. Click the edit button (pencil icon) on the JavaScript Variables (Link List Gadget).
4. A Link List Configuration Popup will appear.
5. You can skip the Title and Number of items to show in list input.
6. In the Sorting section, you can choose between Don't sort, Sort Alphabetically and Sort Reverse Alphabetically. Please choose according to your wishes (Optional).
7. Click the ADD A NEW ITEM button.
8. Here are a few things that can be set:
   
   • In the Site name input, type adSenseID.
   • In the Site URL input, enter your AdSense ID. Example: 996956548100XXXX.
   • If both inputs are set, click the SAVE button next to them.
9. If you want to finish the configuration, click the SAVE button at the bottom.

Adding AdSense Delay Duration (Optional)

This setting is useful for delaying loading of AdSense ads. Follow these steps:

1. Go to Blogger Dashboard, select the Layout menu.
2. Look for the section titled Theme Panel Top.
3. Click the edit button (pencil icon) on the JavaScript Variables (Link List Gadget).
4. A Link List Configuration Popup will appear.
5. You can skip the Title and Number of items to show in list input.
6. In the Sorting section, you can choose between Don't sort, Sort Alphabetically and Sort Reverse Alphabetically. Please choose according to your wishes (Optional).
7. Click the ADD A NEW ITEM button.
8. Here are a few things that can be set:
   
   • In the Site name input, type adSenseDelay.
   • In the Site URL input, enter the delay duration in seconds. For example, if you want to set the duration to 10 seconds, then fill it with 10.
   • If both inputs are set, click the SAVE button next to them.
9. If you want to finish the configuration, click the SAVE button at the bottom.

Color Mode

This setting is useful for enabling or disabling the Color Mode (Dark/Light Mode) Features on Webium Pro Theme. Here are some steps to customize it:

1. Go to Blogger Dashboard, select the Theme menu.
2. Click the CUSTOMIZE button.
3. Click Advanced Dropdown, click Default Options Dropdown and Select Feature Options.
4. Look for the Slider setting named Color Mode (Disable | Enable), drag the slider right or left. Here is the explanation:
   • 1px: Disable - Color Mode will be disabled.
   • 2px: Enable - Color Mode will be enabled.
5. Click the Save button (diskette icon) in the lower right corner.

Pagination Type

This setting is useful for changing the pagination type. You can choose between Next or Previous, Load More or Infinite Scroll. Here are some steps to set up and their explanations:

1. Go to Blogger Dashboard, select the Theme menu.
2. Click the CUSTOMIZE button.
3. Click Advanced Dropdown, click Default Options Dropdown and Select Feature Options.
4. Look for the Slider setting named Pagination Type (Next-Prev | Load More | Infinite Scroll), drag the slider right or left. Here is the explanation:
   • 1px: Next/Previous - Pagination with Previous and Next buttons.
   • 2px: Load More - Pagination with Load More button.
   • 3px: Infinite Scroll - Pagination will automatically load when scrolled.
5. Click the Save button (diskette icon) in the lower right corner.

Native Sharer

Native Sharer is useful for calling the native sharing mechanism of each different device to share data such as text, URLs or files. The available sharing targets depend on the device, but may include clipboard, contacts and email apps, websites, bluetooth, etc. If you want to use it, then follow these steps:

1. Go to Blogger Dashboard, select the Theme menu.
2. Click the CUSTOMIZE button.
3. Click Advanced Dropdown, click Default Options Dropdown and Select Feature Options.
4. Look for the Slider setting named Native Sharer (Disable | Standalone | Combined), drag the slider right or left. Here is the explanation:
   • 1px: Disable - Native Sharer will be disabled.
   • 2px: Standalone - Native Sharer will be enabled and will be standalone (All social share link will be removed).
   • 3px: Combined - Native Sharer will be enabled and will be combined with default social share link.
5. Click the Save button (diskette icon) in the lower right corner.

For now, Native Share only supports some browsers. Among others, Desktop: Google Chrome 99+, Microsoft Edge 96+ and Apple Safari 12.1+. Mobile: Google Chrome 96+, Mozilla Firefox 94+, Apple Safari 12.2.12.5+.

Post Image Zoom Lightbox

This setting is useful for enabling or disabling post Image Lightbox or Image Zooming when clicked. Here are some steps to set up and their explanations:

1. Go to Blogger Dashboard, select the Theme menu.
2. Click the CUSTOMIZE button.
3. Click Advanced Dropdown, click Default Options Dropdown and Select Feature Options.
4. Look for the Slider setting named Post Image Zoom Lightbox (Disable | Enable), drag the slider right or left. Here is the explanation:
   • 1px: Disable - Post Image Zoom will be disabled.
   • 2px: Enable - Post Image Zoom will be enabled.
5. Click the Save button (diskette icon) in the lower right corner.

Customizer Settings

There are several Color settings for all Webium Pro Feature.

Color Settings

There are several color settings for Features on Webium Pro that can be customized, namely:

• Dark Mode Key Color - To set the Main Dark Mode color.
• Dark Mode Background Color - To set the Dark Mode background color.
• Dark Mode Background Color (2nd) - To set the Dark Mode secondary background color.
• Dark Mode Text Color - To set the Dark Mode text color.
• Dark Mode Meta Color - To set the Dark Mode Meta/text color.
• Dark Mode Border Color - To set the Dark Mode border color.

Here are some steps to customize it:

1. Go to Blogger Dashboard, select the Theme menu.
2. Click the CUSTOMIZE button.
3. Click Advanced Dropdown, click Default Options Dropdown and Select Feature Options.
4. Find a color setting and select the color you want to change.
5. Click the Save button (diskette icon) in the lower right corner.

Those are some steps to configure the Features in the Webium Pro Theme. If you have any questions, please write them in the comments section.