The "No Dev Question is Stupid" Thread - Basic HTML / CSS / Etc.

[bernard]

If you've set up your Analytics tracking through Google Tag Manager, you should even be able to configure the form submission event without writing any code.

I use Monster Insights, which uses Google Tag Manager I think, at least it adds the code for GTM.

My issue is mostly if I would cause some kind of conflict with Monster Insights if I add my own tracking code?

 

[mmm91492]

I use Monster Insights, which uses Google Tag Manager I think, at least it adds the code for GTM.

My issue is mostly if I would cause some kind of conflict with Monster Insights if I add my own tracking code?

If you were using this addon (https://www.monsterinsights.com/addon/forms/) and no longer have access to it because you're not paying for premium anymore, your Monster Insights form tracking is probably going to stop working in Analytics when you deactivate the plugin.

 

[Writer_Guy]

I am a believer in being good enough and refining things later, but I get a feeling I should get the website right from the go.

Am I correct?

Also, I'll appreciate if you guys can please recommend a good theme for an encyclopedia-based website.

Thanks!

 

[mmm91492]

I am a believer in being good enough and refining things later, but I get a feeling I should get the website right from the go.

Am I correct?

Also, I'll appreciate if you guys can please recommend a good theme for an encyclopedia-based website.

Thanks!

I think your first instincts are better; get the site functional and refine it as you go.

I think the worst thing you can do is to actually get the site wrong from the go. What I mean by that is, I feel like a lot of people overbuild their website at the start without really knowing what's best for their users. If you've locked yourself into some proprietary theme, plugin, or page-builder and need to change it down the line because it's not as engaging as you expected, it can be a huge pain to do so.

So, start with something simple, see how users react, tweak a little bit, and repeat. It's pretty easy nowadays to set up an A/B test with Google Optimize and Google Analytics.

I wouldn't think an encyclopedia website would need much in the way of complex design anyway. You want the content to be the star, and I would expect an overdesigned theme to distract from that. Wikipedia's "theme" is basically just the color white.

For theme recommendations, I'm pretty sure the BuSo Lightning theme is built for this exact use-case (fast and simple). GeneratePress is another very popular lightweight theme option geared toward customization rather than an out-of-the-box design.

 

[bernard]

Css that doesn't update.. is very frustrating.

I emptied cache in Wordpress, I emptied browser cache and tested several browsers. I used !important.

It even shows up on inspect, but isn't applied? Very weird.

It's a :before with a unicode checkmark, can that have something to do with it?

 

[mmm91492]

Css that doesn't update.. is very frustrating.

I emptied cache in Wordpress, I emptied browser cache and tested several browsers. I used !important.

It even shows up on inspect, but isn't applied? Very weird.

It's a :before with a unicode checkmark, can that have something to do with it?

Do you have a content value set on the :after element? Pseudo-elements (:before and :after) don't show up if there's no content value set. It can just be an empty string ( eg content: ''; ).

When you say it shows up in Inspector, do you mean that you can see the CSS rule in the source file, or can you actually find the :after pseudo-element in the DOM?

If you set it up in a JS Fiddle, does it work?

 

[bernard]

If you set it up in a JS Fiddle, does it work?

No..

I figured it out. You need to use the actual unicode and replace U+ with backslash. If you just copy paste the unicode symbol, then you can't style it, at least not color.

 

[bernard]

@mmm91492 Ok, so now it works on desktop, but not on mobile.

Every other css change I made worked on mobile, but not the color of the unicode/html icon?

 

[mmm91492]

@mmm91492 Ok, so now it works on desktop, but not on mobile.

Every other css change I made worked on mobile, but not the color of the unicode/html icon?

Tough to troubleshoot without actually seeing it, but off the top of my head:

- does the color change not show on your mobile phone, in Chrome inspector when you reduce the screen width down to a mobile size, or neither? If the change is showing on "mobile" view in the developer tools but not on your actual phone, it's probably a caching issue (if this was the last change you made to the stylesheet, that would explain why every other CSS change is working).

- if the change doesn't show in the Chrome inspector, you can go to the Elements tab, highlight the actual pseudo-element in the DOM, and check the Styles tab in the sidebar to see if there is a media query or some other style that is overriding the color.

If you can set it up on JS Fiddle and reproduce the issue I'd be happy to take a closer look.

 

[bernard]

Anyone know how to customize width in Gutenberg blocks, beyond "full width"? I want it to be max width 1200px.

I feel like I'm trying everything, but I can manage to target the columns container in Align-Wide setting. It just doesn't register. I even selected it as an ID, but it just doesn't override the standard Gutenberg settings.

Any ideas what could be wrong?

Edit: Seems to be all kinds of weird cache issues. Really is increasingly difficult to make modifications with all kinds of cache concerns.

 

[mmm91492]

Anyone know how to customize width in Gutenberg blocks, beyond "full width"? I want it to be max width 1200px.

I feel like I'm trying everything, but I can manage to target the columns container in Align-Wide setting. It just doesn't register. I even selected it as an ID, but it just doesn't override the standard Gutenberg settings.

Any ideas what could be wrong?

Edit: Seems to be all kinds of weird cache issues. Really is increasingly difficult to make modifications with all kinds of cache concerns.

The first thing you'll need to consider is the width of the content area. Depending on your theme, you may be able to set this in the theme options, or it might be hardcoded in. Also, different page templates may use a different content area width. I feel like most themes these days have a Full Width page template for when you want design elements to exceed the default content width.

So in most cases that really leaves you with two width options, the width of the content area (which we already discussed may or not be adjustable) and the full width of the screen. Reading your post again, it sounds like you want a single block to never exceed 1200px, regardless of those settings, the width of other blocks, etc. In that case, I would recommend using a container block, which should let you set a specific width for the container and then nest other blocks inside of it (ie, you would have your container with the width set to 1200px, and then the block that you want to be 1200px wide set to full-width inside of the container block).

I don't actually know if this is possible with the default Gutenberg container / row / column blocks, because I've found those blocks to be pretty disappointing. I'd recommend installing the GenerateBlocks plugin (https://generateblocks.com/), since the container and grid blocks the plugin adds are far more customizable and just work way better than the default blocks.

 

[bernard]

@mmm91492 I used a container block and then made it 1200 in width and did some negative margin to get it where I wanted. It was for a comparison table.

I couldn't for the life of me make the full width block in Gutenberg (Astra theme) behave as I wanted. I simply couldn't target it. I don't know if there's some javascript going on?

In any case, I find it pretty difficult to target the correct elements, but I don't know if this is specific to Gutenberg/Wordpress or just in general css.

Things are coming along nicely though. I'm almost done recrearting my Elementor design elements. Next up to convert some of them to blocks, ACF or regular Gutenberg blocks.

 

[freshpeppermint]

Yo i am getting a wordplugin made which is basically a tool. My question is, I also plan on buyin another tool. Should I get it inbuilt this tool or should I get a separate one? Would having a separate plugin cause more lag on the site or like increase page load speed or no?

 

[mmm91492]

Yo i am getting a wordplugin made which is basically a tool. My question is, I also plan on buyin another tool. Should I get it inbuilt this tool or should I get a separate one? Would having a separate plugin cause more lag on the site or like increase page load speed or no?

It really all just depends on how the plugins are built. Generally the thinking is that fewer plugins is better, but in practice it really depends. What's more important is that the plugins are built well, don't introduce bugs or security vulnerabilities, only load additional JS or CSS files on the pages that need them, etc.

It's completely possible that three well-built plugins can be faster than one single plugin which does the same thing as the other three, but does so poorly and bogs down your server with redundant database calls or loads huge render-blocking JavaScript files on every single page on your site.

 

[freshpeppermint]

I am getting this at the bottom and I have debug and stuff enabled.

Notice: ob_end_flush(): failed to send buffer of zlib output compression (0) in /home/example/example.com/wp-includes/functions.php on line 5275

Do you guys know why I am getting this?

 

[bernard]

I am getting this at the bottom and I have debug and stuff enabled.

There seem to be tons of results in Google with that, so try that first would be my advice.

Most problems with Wordpress are because of some conflict with a plugin or theme. If you haven't updated all your themes and plugins then that's a start.

You can also try disabling all plugins or switching theme to see if the problem persists.

 

[freshpeppermint]

Hey I am getting this when I put my site on Website Auditor.

Under the Resources with 4xx server status
"mywebsite.com/wp-content/plugins/shortcodes-ultimate/includes/fonts/fork-awesome-webfont.woff2?v=1.0.11"
Saying it's internal, 404 Not Found. Content type: "text/html"

When I go to this page it says this page doesn't exist.

One more question, I am updating my rankmath meta title and description but every time I hit save it reverts back to the old one. I am changing this one because it's a duplicate meta description.

 

[freshpeppermint]

Hey I am looking for 2 features basically I want one where if you stay on the site and after sometime it just shows you a pop up, or if your about to exit the site it shows it?

And I am also looking for like you know at the very bottom there's like ads? Instead of ads I want there to have a button with some text.

Anyone know like a plugin and stuff to get these features??

 

[Bob_the_Builder]

When I started this website, I knew nothing about child themes.
As a result, I modified CSS, made other ajustments (most via a plugin) to the main theme.

Is there a way back from this? If yes, what is the best approach?

When I update wordpress all the modifications stay, by the way. Normally, they would get overwritten, right? Does that mean the changes I made are stored in the plugin?

 

[ToffeeLa]

When I started this website, I knew nothing about child themes.
As a result, I modified CSS, made other ajustments (most via a plugin) to the main theme.

Is there a way back from this? If yes, what is the best approach?

When I update wordpress all the modifications stay, by the way. Normally, they would get overwritten, right? Does that mean the changes I made are stored in the plugin?

What happens when the plugin gets updated?

 

[mmm91492]

When I started this website, I knew nothing about child themes.
As a result, I modified CSS, made other ajustments (most via a plugin) to the main theme.

Is there a way back from this? If yes, what is the best approach?

When I update wordpress all the modifications stay, by the way. Normally, they would get overwritten, right? Does that mean the changes I made are stored in the plugin?

It's not updating WordPress you need to worry about, it's updating the theme or updating any plugins with files that you've modified.

When you say you've made adjustments to the theme via a plugin, what exactly do you mean? What plugin did you use to make the changes? Depending on whether or not the plugin was modifying files directly versus making changes to database values, the changes may or may not stay in place after updating.

Regardless, I would make a copy of the file directories for any themes or plugins you modified before updating. That way, if the update overrides your edits, you still have them backed up. There are tools that you can use to compare files and directories (Beyond Compare is one, I'm sure there are others) to try and figure out which files you need to create overrides for in a child theme to preserve all your changes.

 

[Bob_the_Builder]

What happens when the plugin gets updated?

Also nothing. The code snippet remains there.

It's not updating WordPress you need to worry about, it's updating the theme or updating any plugins with files that you've modified.

When you say you've made adjustments to the theme via a plugin, what exactly do you mean? What plugin did you use to make the changes? Depending on whether or not the plugin was modifying files directly versus making changes to database values, the changes may or may not stay in place after updating.

Regardless, I would make a copy of the file directories for any themes or plugins you modified before updating. That way, if the update overrides your edits, you still have them backed up. There are tools that you can use to compare files and directories (Beyond Compare is one, I'm sure there are others) to try and figure out which files you need to create overrides for in a child theme to preserve all your changes.

I meant when I update the theme. Nothing happens. The plugin is a snippet plugin where you can insert code snippets.

I only made 1 change directly into the theme files. A lot of changes I made via the 'customize' menu in Wordpress.

The best way forward is to copy the current theme I think? And try to reproduce the exact same situation in the child theme. Maybe delete the adjustments in the parent theme if the child theme is good & live. Then only edit the child theme?

 

[DarkRed]

What did you modify in the theme?

Everything stays except the changes to the main theme when you update it

 

[mmm91492]

Also nothing. The code snippet remains there.

I meant when I update the theme. Nothing happens. The plugin is a snippet plugin where you can insert code snippets.

I only made 1 change directly into the theme files. A lot of changes I made via the 'customize' menu in Wordpress.

The best way forward is to copy the current theme I think? And try to reproduce the exact same situation in the child theme. Maybe delete the adjustments in the parent theme if the child theme is good & live. Then only edit the child theme?

Yeah so any changes made through the Customizer or through something like a Code Snippets plugin should be compatible with updates. Those changes are stored in the database and are independent of the file system. The only time you really have to worry is when you're actually editing the files directly through an FTP client or through the Appearance > Editor menu.

If you want to create a child theme, you don't need to copy the entire existing theme. All that child themes require are a style.css file and a functions.php file. All the other files get inherited from the parent theme directory. You can read more about how to set up a child theme here: https://developer.wordpress.org/themes/advanced-topics/child-themes/

 

[Bob_the_Builder]

What did you modify in the theme?

Everything stays except the changes to the main theme when you update it

I add modified data in the theme files.

Yeah so any changes made through the Customizer or through something like a Code Snippets plugin should be compatible with updates. Those changes are stored in the database and are independent of the file system. The only time you really have to worry is when you're actually editing the files directly through an FTP client or through the Appearance > Editor menu.

If you want to create a child theme, you don't need to copy the entire existing theme. All that child themes require are a style.css file and a functions.php file. All the other files get inherited from the parent theme directory. You can read more about how to set up a child theme here: https://developer.wordpress.org/themes/advanced-topics/child-themes/

Thank you! I will check out how to create a child theme. I only edited 1 file via appeareance > editor menu so hopefully that helps.