Two further padding problems

The first problem I have resolved by adding a title to the search-Widget. – (Nevertheless I do not understand, why the 0px-padding is correct with Widget-title, but not without Widget-titel.)

Has someone any idea regarding the ‘über uns’-Widget-pictures?

How can I ensure that they do not transgress the Widget-Border?

Now I have posted my request there:

https://www.ads-software.com/support/topic/photos-transgress-widget-borders

and

(in German) there:

https://forum.wpde.org/plugins-und-widgets/133595-moreaboutme-widget-fotos-korrekt-einpassen.html

Update regarding ‘Moreaboutme’-/’über uns’-Widget:

https://www.ads-software.com/support/topic/photos-transgress-widget-borders?replies=2#post-6046516

The first problem I have resolved by adding a title to the search-Widget. – (Nevertheless I do not understand, why the 0px-padding is correct with Widget-title, but not without Widget-titel.)

To answer your first question, I think it’s because the padding is coming from padding-top: 0.85em; in the h1 tag:

<h1 class="widget-title">“Kampfsportlerinnen Neuwied” durchsuchen</h1>

h1, h2 {
    font-family: Georgia,"Bitstream Charter",serif;
    font-size: 2rem;
    line-height: 1.05;
    margin-bottom: 0.15em;
    padding-top: 0.85em;
}

So if there’s no widget title, you don’t get that 0.85em of top padding.

Why transgresses the picture within the the second Widget the Widget-border and how can I prevent this?

Looks like the About widget you’re using doesn’t properly clear the floated image within it. Try adding this to your custom CSS:

.widget_moreaboutme_widget {
 overflow: auto;
}

That worked for me using Firebug:

Thank you!

@ https://www.ads-software.com/support/topic/two-further-padding-problems?replies=7#post-6053381

This does not adjust the photo seize; rather it inserts a scrollbar:

https://1a-spielwiese.de/wp-content/uploads/2014/10/Scrollbar-1.jpg

https://1a-spielwiese.de/wp-content/uploads/2014/10/Scrollbar-1.jpg

@ https://www.ads-software.com/support/topic/two-further-padding-problems?replies=7#post-6053349

I think it’s because the padding is coming from padding-top: 0.85em; in the h1 tag: […]. So if there’s no widget title, you don’t get that 0.85em of top padding.

Ok, I understand. – And how can I define a padding-top, which aplies just for the search-form at issue (and not for other input areas), so that I could remove the headline without getting design problems?

Hi there, I see you have changed the design on your about me widget and are using a smaller image now.

For the search widget, if you wish to not use a title, you can add padding to the top of the search form itself using the following CSS. You can adjust the 30px value I have to get the padding you desire.

#searchform {
	padding-top: 30px;
}

@ Searchform

Thank you – with 10px it is fine:

https://kampfsportlerinnenneuwied.1a-spielwiese.de/

And (how) is it possible to substitute both ‘Search’ by the equivalent German terms?

@ ‘I see you have changed the design on your about me widget and are using a smaller image now.’:

Yes, but it would be nicer, not having to tell my user, that they have to use a certain photo seize. I would still prefer, if photos of each size will be automatically adjusted to the proper seize for the Widget.

Glad that worked out with the search widget padding.

At Settings > General in the dashboard, have you set the language to German?

On the image in the about widget, if you can add the larger image back in I can take a look and see if I can get the image to size to the widget area with a CSS modification.

At Settings > General in the dashboard, have you set the language to German?

Yes. Why?

On the image in the about widget, if you can add the larger image back in I can take a look

It’s now a greater photo again:

https://kampfsportlerinnenneuwied.1a-spielwiese.de/

and see if I can get the image to size to the widget area with a CSS modification.

Thank you. However, my problem regards not this photo especially; it should work with photos of any seizes (and displaya of any resolution and bowsers of any type).

Add the following to your child theme CSS and it should take care of the image issue. I’ve used the !important attribute just to be sure.

.moreaboutme_img {
    max-width: 100%;
}

I looked at the de.mo language file and see a translation in it for “Search” and have no idea why it is not being applied. We can try a workaround though. In the Reddle theme directory, find the searchform.php file and copy it over and into your Reddle Child theme directory. Open that file and edit it and you will find these three lines in that file:

<label for="s" class="assistive-text"><?php _e( 'Search', 'reddle' ); ?></label>
<input type="text" class="field" name="s" id="s" placeholder="<?php esc_attr_e( 'Search', 'reddle' ); ?>" />
<input type="submit" class="submit" name="submit" id="searchsubmit" value="<?php esc_attr_e( 'Search', 'reddle' ); ?>" />

Change “Search” in those three lines to your chosen term, such as Suchen and save the file and then view your site. You may have to force refresh the page or clear your browser cache.

Let me know how things go.

@ Photo:

Works. I tested it as well with a 1600 x 1200 photo. – Thank you.

@ Language:

In the Reddle theme directory, find the searchform.php file and copy it over and into your Reddle Child theme directory.

That it should work in general this way, I knew. I thought only it could be more complicate regarding buttons.

I looked at the de.mo language file and see a translation in it for “Search” and have no idea why it is not being applied.

Does is mean, things like the edit button and text like ‘Posted in’ should be translated as well already? – It seems to me that none English theme-text is translated automatically. –

Only the introductory comment text ‘One thought on’ / ‘x thoughts on’ I changed already via php-file editing.

It could be that not all translations have been done. Translations are a volunteer effort, and you can help out with translations if you are so inclined. For themes designed by Automattic, you can check on things here: https://translate.wordpress.com/projects . Click on WordPress.com and then click on “Themes” and then click on the theme name to see how far along the translation is. For Reddle, it looks like about 93%. It could be that there are some adjustments that need to be made to the theme itself.

I’m going to ask our team about that and will post back here as soon as I get a reply.

Hi again,
It may well be that the language files are not in your install of Reddle. In your cPanel, create a “languages folder in your child theme folder.

Next, go here, https://translate.wordpress.com/projects/wpcom/themes/reddle/de/default , and at the bottom of that page, with “all current selected and as Machine Object Message Catalog (.mo) selected, click the “Export” button. Upload that file to the “languages” folder you created in your child theme folder.

Next you will have to let the child theme know that the language file is there by calling in the folder from your child theme’s functions.php file. If you do not have a functions.php file in your child theme, create one using a plain text editor (not rich text) and add the following to it:

<?php
add_action( 'after_setup_theme', 'my_child_theme_setup' );
function my_child_theme_setup() {
    load_child_theme_textdomain( 'reddle', get_stylesheet_directory() . '/languages' );
}

If you already have a functions.php file, then add copy the above except for the opening <?php tag.

The above function assumes you have placed your .mo file in a folder called “languages” within your child theme.

Let me know how it goes.