This time, to improve the usability of the Mobile screen,
- Installation of header menu
- Installation of footer menu
- Installation of a back to top button
This article is mainly about the addition of plug-ins for three points
Installation of header menu by WP Mobile Menu
Added WP Mobile Menu plugin to install header menu.
This plugin allows you to set up three types of menus in the free frame.
- header menu
- left side menu
- right side menu
Bottom menu is the scope of the fee.
Detailed settings are available, so we are checking them one by one as we proceed.After the contents of the pseudo-global menu have been added, we will hide it on mobile devices.
You can add fixed pages, categories, tags, and links.It does not seem possible to add archives, results of other plugins, etc. freely.
Enabled top menu and right side menu.
As a Google AdSense measure, the top menu is not fixed in the screen and disappears when scrolling.Ads are not displayed within the first display area, so they are not hidden when the side menu is opened.
Installation of footer menu by WP Mobile Bottom Menu
Added WP Mobile Button Menu plugin to install footer menu.
I have been installing my own pseudo-footer menu.
However, due to my inexperience with the technology, I could not get the pseudo-footer menu to display stably.
I looked again for a plugin and found that WP Mobile Botton Menu seemed to be easy to use, so I installed and configured it.
The footer menu should appear on the phone screen.
However, when I specified an image instead of an icon, the display was disrupted, so I decided to use Font Awesome icons until I could figure out the cause.
WPFront Scroll Top button to go back to the top
We also could not get the Back to Top button to work properly, so we installed the WPFront Scroll Top plugin.
It was difficult to balance with Google reCAPTCHA and the footer menu, but the setup itself was quick and easy.
The button to return to the top of the page in the pseudo-footer menu installed on this page was not stable, as it did not work or not work, so it was deleted.
The button installed with the WPFront Scroll Top plugin works stably and the display disappears when the scrolling stops, which is what we wanted.
Tweak LiteSpeed Cache settings
The WPFront Scroll Top plugin was also unstable at first, even after excluding JavaScript in the LiteSpeed Cache plugin’s page optimization and adding CSS content to style.css.
Finally, the JavaScript “Deferred JS loading” item was set to “Deferred” to ensure stable operation.
Maximum usage of LiteSpeed Cache page optimization
February 2025 has also reached the limit for page optimization usage for the LiteSpeed Cache plugin.Even though it is only 21 days.
There are multiple reasons.
- The fact that more than once I had to delete all of the UCSS to reflect the results of CSS tweaks.
- Every article is written in three languages, so you must be generating at least 24 UCSS in one day.
At this rate it is difficult to create UCSS for all pages.We have set the category pages not to be generated.Check to see if there are any other items that can be excluded.
We will not know if the plug-ins we have added will work properly until UCSS is generated.We will make minor modifications in various areas in preparation for next month, March, when page optimization usage will be restored.
Musubi
As optimization for mobile screens,
- header menu
- footer menu
- Back to top button
installed.We have installed and configured the plugins for each.For now, we’re done with the items we want to add to the Mobile screen; we’ll finish the tweaks before March, when the LiteSpeed Cache plugin’s page optimization usage returns.
I was not able to update during the day today, so I will update at night.I was unable to take a lunch break because I had personal research to do.There are days like this.
Leave a Reply