- This topic has 13 replies, 3 voices, and was last updated 3 years, 7 months ago by
.
-
Posts
-
Two questions:
1. After migrating to GeneratePress + Generateblocks from another popular theme, there’s an issue with the images.
Not all images are displayed in the frontend. This is caused by the image dimensions added at the end of the imageURL, i.e.: domain.com/wp-content/imagename-1024×600.jpg. If I manually change this in the post editor to domain.com/wp-content/imagename.jpg, they re-appear.
Already regenerated the images, but no solution yet. Is there a way to fix this?
2. Links aren’t visible in the post editor, probably because we’re using some manual linksstyling in-post and set the linkcolor in customize to black.
I added the code below, so all styling is removed. If I want to edit a page for example, there’s no styling, which makes it undoable to edit the GB for example.
add_action( 'after_setup_theme', function() { remove_action( 'enqueue_block_editor_assets', 'generate_enqueue_backend_block_editor_assets' ); } );Is there a solution, to keep using the underlined links (via CSS) and still have the ‘styling’ active in the post editor with links visbible?
Thanks!
Customer Support
Hi Bright,
1. How did you migrate the images?
2.For better understanding, can you provide screenshots of the issue?
Uploading Screenshots: https://docs.generatepress.com/article/using-the-premium-support-forum/#uploading-screenshots
1. Via the standard WordPress export/import
2. The main issue is: links aren’t hightlighted/colored in the post editor. Can’t really screenshot that. The links look like regular text.
1. To clarify, is it the image names that changed when you migrated or is it the URL in the Image Blocks?
2. You can do so by enqueueing your own style in the Block Editor if you’re using a Child theme.
For instance, in your Child Theme directory, you create a new file called
my-editor-style.cssThen, add this PHP in functions.php:
add_action( 'enqueue_block_editor_assets', function() { wp_enqueue_style( 'my-block-editor-styles', get_stylesheet_directory_uri() . "/my-editor-style.css", false,'1.0', 'all' ); } );Your
my-editor-style.cssshould have this code for instance to differentiate it:a { color: #ff0000; !important; }Thanks for your reply!
1. I’ll try to explain:
On the OLD and NEW site, the image block looks like:
<!-- wp:image {"id":XXX,"sizeSlug":"large","linkDestination":"none"} --> <figure class="wp-block-image size-large"><img src="https://domain.com/wp-content/uploads/2022/09/imagename-1024x576.jpg" alt="XXXXXXX" class="wp-image-6947"/> <!-- /wp:image -->On the old site, the image is displayed. On the new site, it’s not. When I remove the size from the image URL (-1024×576.jpg) it re-appears.
2. Tried adding the code to functions + added the CSS file with the suggested CSS-code, both to child. Doesn’t seem work.
Edit: it does work, but not in the ‘content area’ of the post editor. It works in the sidebar of the post editor.
Thanks!
Customer Support
Hi there,
is it possible to see page where some of the images are broken ?
Of course, info in PI.
Very odd, if i look at the first broken image ie.
Chromecast Bluetooth - JBL Speakerand check the HTML on the frontendhttps://www.screencast.com/t/zLfc7ygSOA0
This shows the
size-largeclass, and the-1024×576string – both of which would only get added to the HTML if a Large image size was selected in the Editor.But if i check that Image in the Media Library its Original ( Full ) size is 1024px, so there is NO large image as WP would not have generated one as the Full size image is the same size as the large image.
If i edit that page and select that image, i can also see that only theThumbnail, Medium and Full Sizeoptions are available.Its odd, as i cannot see how WP is outputting a Large image when none exists. Unless the other theme was specifically creating its own image attachment sizes.
How many images are like this ?
Thanks for researching! On this particular site, it’s about 30 images. Adjusted manually for now. On another site there are about 600?! images.
Just realized, maybe this has something to do with Litespeed’s image optimization? Thet add specific widht’s and heights to images? Not really sure if this can cause this issue?
Did you also have a chance to look into the post editor links as mentioned above?
Thanks!
How are the link styles added ?
If its is via CSS in the Customizer > Additional CSS then you can use this snippet:
add_filter( 'block_editor_settings_all', function( $editor_settings ) { $css = wp_get_custom_css_post()->post_content; $editor_settings['styles'][] = array( 'css' => $css ); return $editor_settings; } );If its loaded via a child theme style sheet:
add_filter( 'generate_editor_styles', function( $editor_styles ) { $editor_styles[] = 'your-editor-style.css'; return $editor_styles; } );change the
your-editor-style.cssto the name of your stylesheet.Not really sure if I completely understand, what I did for now:
Made a CSS-file in generatepress-child:
my-editor-style.cssI added the red links CSS
a { color: #ff0000; !important; }I added this to snippets
add_filter( 'generate_editor_styles', function( $editor_styles ) { $editor_styles[] = 'my-editor-style.css'; return $editor_styles; } );But the links are still ‘black’ in the post editor. Am I missing something?
Ok, so simple link colors should automatically apply from what you have set in the Customizer > Colors > Body > Link or Content > Link – are you not using those settings ?
Just added the link color in the customizer and changed the link-color for articles and some others via CSS (for the frontend).Thanks for the support!
Glad to be of help
- You must be logged in to reply to this topic.
