Unknown CSS, mobile/tablet optimization?

  • Tomi

    (@tomitech)


    1 year ago

    I recently got back into working on my site code after a 3 year hiatus. I am trying to understand the origins of the CSS code here – whether it’s from theme updates (Flatsome w/ child), plugins, GUI customizations, or my own manual adding. I’ve used GPT for explaining it, and it appears to be for mobile/tablet optimization and responsivity.

    I don’t remember adding any of it since I never really worried about mobile or tablet responsivity – it was something I was going to do in the future, but as you can see, there are multiple blocks. Perhaps I read a thread somewhere about mobile responsivity, and I was persuaded into adding it to my custom CSS. That is my best guess, but I am hoping someone with much better expertise can give me their best guess.

    Just hoping to clean things up so I don’t get too left behind on the code for my own site!

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)
  • Moderator t-p

    (@t-p)

    Likely its from your theme.

    Since you use a commercial theme and need support, please go to their official support channel. In order to be good stewards of the WordPress community, and encourage innovation and progress, we feel it’s important to direct people to those official locations.

    https://themeforest.net/

    Forum volunteers are also not given access to commercial products, so they would not know why your commercial theme or plugin is not working properly. This is one other reason why volunteers forward you to the commercial product’s vendors. The vendors are responsible for supporting their commercial product.

    As the developer is aware, commercial products are not supported in these forums.

    Alexander

    (@alextonio22)

    Hi Tomi,

    I understand the concern regarding the origin of CSS code on your WordPress site, especially after a hiatus. To help you identify and clean up the code, here are several solutions.

    1. Check Theme Customizer
      • Navigate to your WordPress dashboard.
      • Go to “Appearance” > “Customize.”
      • Review the Theme Customizer for any settings related to mobile and tablet responsiveness. Adjust or remove unnecessary customizations.
    2. Child Theme
      • Examine your child theme’s style.css file for any customizations. Remove or modify code blocks that pertain to mobile and tablet responsiveness as needed.
    3. Theme Updates
      • Check the theme’s changelog or release notes for updates related to mobile responsiveness. If there are new features or optimizations, consider adjusting your code accordingly.
    4. Plugins and Page Builders
      • Review the settings of plugins, especially those related to performance optimization or responsive design. Check any visual editors or page builders you’ve used for added CSS related to mobile responsiveness.

    If these solutions do not resolve the issue or if you need further assistance, please provide more details about the concern. This could include specific CSS code snippets, the location where you’ve found the code, or any error messages you’re encountering. With additional information, I’ll be better equipped to offer more targeted guidance on cleaning up and optimizing your site’s CSS.

    Kind regards,

    Alexander

    Moderator bcworkz

    (@bcworkz)

    You can use your browser’s element inspector tool to learn which CSS is being applied and where it comes from. You’ll first need to identify an element using the class or ID attributes selected by the CSS in question. They can be searched for from within the inspector tool. Click on one of the elements and its applicable CSS will be shown. Find one of the rules in question and its source will be indicated. The source file’s URL will indicate which theme or plugin it belongs to.

    If the source is shown as (index) then it is from inline CSS. Find the applicable CSS in the page’s source HTML view. If the related style tag’s ID is “wp-custom-css” then the CSS comes from the customizer’s additional CSS section. Any other style tag attributes should be a clue to its origin.

    If you have terminal access to the site, you could grep (full text search) for a particular rule and all files containing the search string will be returned. If no file contains the CSS you’re looking for, then it’s saved in your DB somewhere. You can search the DB with the phpMyAdmin app. How and where it was saved should be an indication of which module is responsible for it being there.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Unknown CSS, mobile/tablet optimization?’ is closed to new replies.