Q&A Having an awesome website!

[lashman]

Me too! Googling for it I saw people asking for it 4 years ago!

RIP in pepperoni

 

[Copons]

lucky you ... i have to do this shit manually every 3 months

Fuck, how I hate this kind of crap. Let's encrypt is literally free and available for everybody, and yet some hosts (including the one I use for my old sites) want you to pay for it, or do some crazy useless stuff.

I just saw that there is a plug in for Gutenberg, I thought it was a part of Wordpress 5? Is there any need to install the plug in?

The Gutenberg Plugin is basically the development version. It's updated every 2 weeks, as opposed to WordPress Core that usually sticks to a major update every 2 months.

If you only want stable, super tested stuff: don't use the plugin.
If you want to try new stuff, that might also be removed in the future: use the plugin.
To be honest, I'd recommend to stay clear from the plugin, because things tend to change a lot before "freezing" when entering into WordPress Core.

I have a question about blogging, I'm mostly using the app to do it, but how do I change the author? I have an admin account and an editor account, the later which I want to be the face outwards. But from the app only the admin is the author. Tried googling but couldn't really find any help.

Good question. Apparently the app doesn't let you change the post author...
I guess either you log in as the editor user, or I'm afraid you're stuck with the normal site.

Yeah now I just go change on the site in chrome app.

Fun fact: the WordPress.com Chrome app is... erm... a link to the WordPress.com site.
I've learned it myself a few days ago. Apparently it's still there because some people keep using it, but in fact it doesn't do anything at all.

 

[Le Pertti]

The Gutenberg Plugin is basically the development version. It's updated every 2 weeks, as opposed to WordPress Core that usually sticks to a major update every 2 months.

If you only want stable, super tested stuff: don't use the plugin.
If you want to try new stuff, that might also be removed in the future: use the plugin.
To be honest, I'd recommend to stay clear from the plugin, because things tend to change a lot before "freezing" when entering into WordPress Core.

Hmh I don't mind unstable stuff, I rather have new stuff. So might install it.

Good question. Apparently the app doesn't let you change the post author...
I guess either you log in as the editor user, or I'm afraid you're stuck with the normal site.

Using the app, it's tied to my Wordpress.com account but I only use own site in the app. Is there a way to have ones Wordpress,com user be an editor on ones own site and have that be default?

Fun fact: the WordPress.com Chrome app is... erm... a link to the WordPress.com site.
I've learned it myself a few days ago. Apparently it's still there because some people keep using it, but in fact it doesn't do anything at all.

I mean I was using chrome on my phone, not the Wordpress app for chrome.


I was playing around to see how I would post images on the blog, posting single images with blocks is great because I can choose the quality of the pic, but when making a gallery I can't? That means pics are blurry. Am I missing something?

 

[Le Pertti]

Heeeeeeelp! For some reason my page takes minutes to load and I don't know why!? I contacted my webhost and they say there are no issues on their end that might be causing it and I have no idea what it could be? I mostly just have official plugins installed

 

[lashman]

Heeeeeeelp! For some reason my page takes minutes to load and I don't know why!? I contacted my webhost and they say there are no issues on their end that might be causing it and I have no idea what it could be? I mostly just have official plugins installed

in that case - it DEFINITELY shouldn't be happening ... not unless you have some really HUGE images on there

 

[Le Pertti]

in that case - it DEFINITELY shouldn't be happening ... not unless you have some really HUGE images on there

Well I do haha, but it was never an issue before. Right now it kind of just gets stuck on starting to load the site for a long time.

 

[lashman]

Well I do haha, but it was never an issue before. Right now it kind of just gets stuck on starting to load the site for a long time.

huh ... that's really weird :/ no idea what's going on

maybe Copons will be able to help

 

[Le Pertti]

Seems it was the webhost after all. Thankfully the support was fast to find the source of the problem. It was a server node that was slower than usual.

 

[lashman]

Seems it was the webhost after all. Thankfully the support was fast to find the source of the problem. It was a server node that was slower than usual.

woohoo ... nice!

 

[Copons]

Ah! Good!
I'm total crap at figuring out server issues, so thankfully your host support was spot on!

 

[Phoenix RISING]

We at http://www.geeksundergrace.com/ are due a makeover.

I'm sensitive to this topic because I'm on its board, and we're considering website options.

We don't have a mobile version of our site, which, to our knowledge, Google "penalizes" for in terms of hits.

This is stuff I don't know about I just vote yeh or nay. I am a creator. I curate content. I leave the web development and bill-paying to other folks.


We consulted one firm that builds websites and they quoted us at $11k as their non-profit discount from $18k. Man, we just a geeky pop culture website aimed at Christians. We don't have that kind of cheese!

So now we're looking into upgrading our theme. I don't care. Whatever. My two priorities are 1. mobile website and 2. speed.

I like our current layout though. I'm not a fan of change for the sake of it.

So yeah, I'm totally with the OP. Don't know what steps to take.

 

[Copons]

We don't have a mobile version of our site, which, to our knowledge, Google "penalizes" for in terms of hits.

I can't help you with your site, but I definitely can clarify this.

You don't need a mobile version, but simply that your site is "mobile-friendly".
It basically means that the site looks and works fine on small screens and behave appropriately with the fact that a finger is larger than a mouse cursor (so, for example, buttons should be large enough, and have enough space around to avoid mis-touching the wrong button).

You can check it on your phone of course, or just resizing the browser window.
You could even use the browser dev tools to emulate the actual size of some common phones.

Google has its own test, if you want to try it: Mobile-Friendly Test - Google Search Console (spoiler: your site passes it just fine).

 

[Phoenix RISING]

I can't help you with your site, but I definitely can clarify this.

You don't need a mobile version, but simply that your site is "mobile-friendly".
It basically means that the site looks and works fine on small screens and behave appropriately with the fact that a finger is larger than a mouse cursor (so, for example, buttons should be large enough, and have enough space around to avoid mis-touching the wrong button).

You can check it on your phone of course, or just resizing the browser window.
You could even use the browser dev tools to emulate the actual size of some common phones.

Google has its own test, if you want to try it: Mobile-Friendly Test - Google Search Console (spoiler: your site passes it just fine).

Yeah, it creates a smaller version but it's not optimal. It's a scaled-down version of a page you'd view on PC, but I'd prefer something more specialized.

Thanks for the affirmation though!

 

[Le Pertti]

Ugh I think I suddenly became little daft, but for the life of me I can't figure out how to change the font for a Verse Gutenberg block!? I've tried to change custom css thingie, tried to specify "pre" class in the css, I've tried to specify the exact .wp-block-verse but nothing seems to do anything!?

 

[lashman]

Ugh I think I suddenly became little daft, but for the life of me I can't figure out how to change the font for a Verse Gutenberg block!? I've tried to change custom css thingie, tried to specify "pre" class in the css, I've tried to specify the exact .wp-block-verse but nothing seems to do anything!?

paging Copons

 

[Le Pertti]

They say coding is about problem solving, but I hate having problems!XD

Also don't have to tag copons since work isn't what he should see coming here to hear about games.XD

 

[Copons]

Ugh I think I suddenly became little daft, but for the life of me I can't figure out how to change the font for a Verse Gutenberg block!? I've tried to change custom css thingie, tried to specify "pre" class in the css, I've tried to specify the exact .wp-block-verse but nothing seems to do anything!?

I'm totally unfamiliar with that block but at a quick inspection it turns out its font family has a kind of a high specificity:

.entry .entry-content .wp-block-verse {
    font-family:
        "NonBreakingSpaceOverride",
        "Hoefler Text",
        "Baskerville Old Face",
        Garamond,
        "Times New Roman",
        serif;
}

You should be good to go by overriding .entry .entry-content .wp-block-verse.

Just FYI the NonBreakingSpaceOverride font is a workaround for a spacing issue of Hoefler Text on Chrome, only happening in the editor.
If you want to customize the Verse style only on the front-end, disregard it. Otherwise, if you customize the editor style as well and you notice something off when typing in that block, try adding NonBreakingSpaceOverride back.

 

[Le Pertti]

I'm totally unfamiliar with that block but at a quick inspection it turns out its font family has a kind of a high specificity:

.entry .entry-content .wp-block-verse {
    font-family:
        "NonBreakingSpaceOverride",
        "Hoefler Text",
        "Baskerville Old Face",
        Garamond,
        "Times New Roman",
        serif;
}

You should be good to go by overriding .entry .entry-content .wp-block-verse.

Just FYI the NonBreakingSpaceOverride font is a workaround for a spacing issue of Hoefler Text on Chrome, only happening in the editor.
If you want to customize the Verse style only on the front-end, disregard it. Otherwise, if you customize the editor style as well and you notice something off when typing in that block, try adding NonBreakingSpaceOverride back.

Yeah that's the thing, nothing I do in css does anything.T_T And when I inspect on chrome it gives me this:

So maybe the css is set somewhere else and I can't override it? I did my theme quite from the ground up but I did add the support to my theme in functions.
Oh yeah here's what I have in my CSS:

I only have the size thing just to see clearly when I'm doing something haha.

 

[Copons]

Yeah that's the thing, nothing I do in css does anything.T_T

Aight so your theme doesn't have .entry in the posts' <article> classes, which is what the Block Editor expects when applying styles to the Verse block.

Now, you can either do that, or increase the CSS specificity to override the <pre> default font (which is a monospace one) by doing something like this:

pre.wp-block-verse {
  font-family: 'Merriweather', serif;
}

(I've tried both solutions in the Chrome's dev tools and they both seem to work fine. I don't have a strong preference for either, but maybe it could be worthier adding .entry to the <article>s in the off chance other parts of the editor rely on it.)

 

[Le Pertti]

Aight so your theme doesn't have .entry in the posts' <article> classes, which is what the Block Editor expects when applying styles to the Verse block.

Now, you can either do that, or increase the CSS specificity to override the <pre> default font (which is a monospace one) by doing something like this:

pre.wp-block-verse {
  font-family: 'Merriweather', serif;
}

(I've tried both solutions in the Chrome's dev tools and they both seem to work fine. I don't have a strong preference for either, but maybe it could be worthier adding .entry to the <article>s in the off chance other parts of the editor rely on it.)

Yeah I tried the css trick but didn't work either.XD

So my content.php looks like this, it's pretty much a copy of twenty nineteen, and it doesn't have entry either?

<?php
/**
* Template part for displaying posts
*
* @link https://developer.wordpress.org/themes/basics/template-hierarchy/
*
* @package Fancier2019
*/

?>

<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
    <header class="entry-header">
        <?php
        if ( is_singular() ) :
            the_title( '<h1 class="entry-title">', '</h1>' );
        else :
            the_title( '<h2 class="entry-title"><a href="' . esc_url( get_permalink() ) . '" rel="bookmark">', '</a></h2>' );
        endif;

        if ( 'post' === get_post_type() ) :
            ?>
            <div class="entry-meta">
                <?php
                fancier2019_posted_on();
               
                fancier2019_posted_by();
                ?>
            </div><!-- .entry-meta -->
        <?php endif; ?>
    </header><!-- .entry-header -->

    <?php fancier2019_post_thumbnail(); ?>

    <div class="entry-content">
        <?php
        the_content( sprintf(
            wp_kses(
                /* translators: %s: Name of current post. Only visible to screen readers */
                __( 'Continue reading<span class="screen-reader-text"> "%s"</span>', 'fancier2019' ),
                array(
                    'span' => array(
                        'class' => array(),
                    ),
                )
            ),
            get_the_title()
        ) );

        wp_link_pages( array(
            'before' => '<div class="page-links">' . esc_html__( 'Pages:', 'fancier2019' ),
            'after'  => '</div>',
        ) );
        ?>
    </div><!-- .entry-content -->

    <footer class="entry-footer">
        <?php fancier2019_entry_footer(); ?>
    </footer><!-- .entry-footer -->
</article><!-- #post-<?php the_ID(); ?> -->
<hr class="wp-block-separator-custom" style="
    width:  33%;"/>

Also thanks for helping!

 

[Copons]

Monooboe Twenty Nineteen adds the entry class through a filter (not the most obvious way, but the most WordPress-y):

WordPress/twentynineteen

Twenty Nineteen is a theme now included in all WordPress installs. To report any issues please go here: https://core.trac.wordpress.org/newticket - WordPress/twentynineteen

github.com

The flexibility of a filter might be overkill for you, but you can just add additional classes as a space-separated post_class argument. E.g.

<article id="post-<?php the_ID(); ?>" <?php post_class( 'entry' ); ?>>
    ...
</article>

 

[Le Pertti]

Monooboe Twenty Nineteen adds the entry class through a filter (not the most obvious way, but the most WordPress-y):

WordPress/twentynineteen

Twenty Nineteen is a theme now included in all WordPress installs. To report any issues please go here: https://core.trac.wordpress.org/newticket - WordPress/twentynineteen

github.com

The flexibility of a filter might be overkill for you, but you can just add additional classes as a space-separated post_class argument. E.g.

<article id="post-<?php the_ID(); ?>" <?php post_class( 'entry' ); ?>>
    ...
</article>

I was so sure that would do it! But still can't change anything.XD So inspecting the site it seems to be using this css: https://fancierlust.com/wp-includes/css/dist/block-library/style.min.css?ver=5.2.2

Why is that and how do I force it to use my css?

 

[Copons]

Monooboe wait I can see like right now that your latest post has the correct style applied to the Verse (black text on black background).
Could it be that for you it's using a cached version of the stylesheet?
Try refreshing the page with the dev tools open (make sure to go in their settings and disable the cache when they are open!), or make sure to update the enqueued style version when calling wp_enqueue_style (see the $ver parameter)

 

[Le Pertti]

Monooboe wait I can see like right now that your latest post has the correct style applied to the Verse (black text on black background).
Could it be that for you it's using a cached version of the stylesheet?
Try refreshing the page with the dev tools open (make sure to go in their settings and disable the cache when they are open!), or make sure to update the enqueued style version when calling wp_enqueue_style (see the $ver parameter)

Haha yes! It works now and it was that I had to clear out my cache! XD I think I might have had problems with this before, that changed take long time to happen, because of cache. Need to keep that in mind and did change it in the settings!

All the thanks to you! Such a simple thing I wanted to do, change font but wow what a learning experience haha.

 

[Le Pertti]

So this is a question to everyone really, but I was wondering what makes you like and come back to a website?

I'm trying to figure just what kind of small quality of life things I should do. Both from design and content perspective,. The latter I know I suck at the moment but my goal is to have something everyday but as it is now I'm just too damn unproductive.

 

[lashman]

So this is a question to everyone really, but I was wondering what makes you like and come back to a website?

fresh content, i guess

 

[Le Pertti]

fresh content, i guess

My weakness! But yeah, I should concentrate on that before worrying about the technical stuff.

 

[lashman]

My weakness! But yeah, I should concentrate on that before worrying about the technical stuff.

yeah, probably ... i mean - if you don't really add new stuff often and it's just a static page ... then it doesn't really matter how awesome it looks because people would only need to see it once to see everything

 

[Le Pertti]

Anyone have experience with hosting a website on google cloud? I watched a bunch of YouTube recommendations on it and it seems it's possible to have it be much cheaper? One even said that web hosting firms often themselves use goole cloud that they then sell.

Edit: Ok seems it's just cheaper the first year since they have an 300 dollar credit offer the first year.

 

[Phoenix RISING]

So this is a question to everyone really, but I was wondering what makes you like and come back to a website?

I'm trying to figure just what kind of small quality of life things I should do. Both from design and content perspective,. The latter I know I suck at the moment but my goal is to have something everyday but as it is now I'm just too damn unproductive.

Community participation and topic variety is what keeps me coming back.

Me not feeling like I post and I don't know if anyone is reading anything I'm saying.

 

[Le Pertti]

I'm diving into trying to find a good plug in to show photos and it's impossible!XD At first it was mostly "ooh this looks good... oh try lite version but buy" and that is pretty much all plug ins, BUT then I found one that works exactly as I want EXCEPT how can someone make a gallery slide show that doesnt support captions? How?

So I have to choose a gallery slideshow that covers the photo with junk but with captions OR a gallery slideshow that puts the photo up front but no captions.XD

 

[Le Pertti]

Copons What happened to wordpress!? Suddenly it has started to stretch my images when it didn't before? I have to add an "height auto" into the CSS for different view mode classes, like

.wp-block-image.alignwide img {
    height: auto;
}

Only thing I've done is install yoast but can that mess that much?

 

[Copons]

Copons What happened to wordpress!? Suddenly it has started to stretch my images when it didn't before? I have to add an "height auto" into the CSS for different view mode classes, like

.wp-block-image.alignwide img {
    height: auto;
}

Only thing I've done is install yoast but can that mess that much?

I'm not super involved with what happens with the standalone WP, but considering that the new version just released a few days ago, I'm much more inclined to think the issue is caused by a change in there, rather than by Yoast, which is a high quality plugin.

It's generally a good idea to add the auto height to all images anyway, so your fix looks perfectly appropriate to me.

If anything, I'd go with img { height: auto; }.
It would give all images the auto height which keeps them scaled with the correct ratio, while also keeping the CSS selector as unspecific as possible, which means that's easier to override, in the off-chance you need to set a custom height for some particular cases.

 

[Le Pertti]

Excellent tip Copons ! Yeah it might be 5.5 that caused it, I just didn't notice it. I used to handle image things with Gutenberg blocks and they used to handle correct scaling.

 

[Le Pertti]

I've made some small fixes to my site to make it work well on mobiles and on tablets. EXCEPT on phones in landscape mode, because fuck those people!XD

Also moved everything to my main site, www.perttiteurajarvi.com because most of what I do doesnt go really with the goal I had for my former site. Not sure what I will do with it later.

 

[Copons]

I've made some small fixes to my site to make it work well on mobiles and on tablets. EXCEPT on phones in landscape mode, because fuck those people!XD

Also moved everything to my main site, www.perttiteurajarvi.com because most of what I do doesnt go really with the goal I had for my former site. Not sure what I will do with it later.

Noice!
You might want to check the main navigation's right margin and padding, which cause the horizontal scrollbar to appear at some screen widths.

 

[Le Pertti]

Noice!
You might want to check the main navigation's right margin and padding, which cause the horizontal scrollbar to appear at some screen widths.

Oh! Need to look into that. I keep cutting code and pasting so much that I'm amazed it holds together.XD

EDIT: Fixed it! I think. But I think the some nav stuff isn't aligned nicely with other elements, but good enough. Thanks for the headsup!