Tesseract Theme Widget in Header

Trialstyle98
(@trialstyle98)

vor 8 Jahre

Hallo,

ich habe das Tesseract Theme.
Ich möchte nun eine zweisprachige Seite machen. Dazu soll das Sprachumschalter-Widget von Polylang in den Header integriert werden.
Dort ist allerdings in meinem Theme kein Widget vorgesehen. Wie bekomme ich da nun am einfachsten einen Sprachumschalter hin?
Am Theme rumschreiben, dass ich ein Widget integrieren kann?
Oder das Theme so abändern, dass ich zwei Buttons im Header einfüge (Deutsch/Englisch), die dann quasi ihren Wert an Polylang schicken?
Oder noch eine andere Lösung? Wie kann ich das umsetzen?

Vielen Dank schon mal!
Gruß
Jannis

Ansicht von 15 Antworten - 1 bis 15 (von insgesamt 17)

1 2 →

Martin Robbins
(@santeven)

vor 8 Jahre

Hello,

I have the Tesseract Theme.
I would now like to make a bilingual page. For this, the language switcher widget is to be integrated in the header of Polylang.
There, however, not a widget is provided in my Theme. How do I get there now easiest a language switcher to go?
On Theme rumschreiben that I can integrate a widget?
Or change the theme so that I have two buttons in the header insert (German / English), which then send their quasi value Polylang?
Or another solution? How can I implement it?

Thank you ever!
greeting
Jannis

First you should register a new widget-area, into which you then can insert the widget. Typically this would be accomplished within your theme functions.php file. Or via a plugin you write yourself would be better.

Then you would create a header-sidebar to display the widget-area already registered and containing your widget. Typically this would be within your theme header.php file.

Zuerst sollten Sie ein neues Widget-Bereich, in den Sie dann das Widget einfügen registrieren. Typischerweise würde dies in Ihrem Thema functions.php-Datei durchgeführt werden. Oder über ein Plugin schreiben Sie selbst wäre besser.

Dann können Sie eine Kopfleiste, die bereits registriert Widget-Bereich und mit Ihrem Widget angezeigt schaffen würde. Typischerweise würde dies in Ihrem Thema header.php Datei sein.

Moderator Torsten Landsiedel
(@zodiac1978)

vor 8 Jahre

Child-Theme erstellen und dort den Header anpassen:
http://codex.wordpress.org/Child_Themes

Siehe:
https://polylang.wordpress.com/documentation/documentation-for-developers/functions-reference/

Gruß, Torsten

Martin Robbins
(@santeven)

vor 8 Jahre

Danke Torsten @zodiac1978, mein srechtlich Deutsch ube ich, mitt Hilfe dem https://translate.google.com/. Und vieleicht auch den OP hilfen. Child-Theme kenne ich, habe’s hier vergassen. Ich werde polylang studieren.

Edi
(@psychosopher)

vor 8 Jahre

Dort ist allerdings in meinem Theme kein Widget vorgesehen. Wie bekomme ich da nun am einfachsten einen Sprachumschalter hin?

Es kommt darauf an, wo Du im Header den Sprachenumschalter positionieren willst. Du kannst ihn beispielsweise einfach auch als Menüpunkt hinzufügen (unter „Menüs“).

Thread-Starter Trialstyle98
(@trialstyle98)

vor 8 Jahre

Vielen Dank erstmal für die vielen Antworten!
War die letzten Tage im Ausland und konnte mich deswegen leider erst jetzt wieder melden.
So wie es aussieht habe ich im Moment 3 Möglichkeiten:

#1 von @santeven:
Widget-Area registrieren & Widget einfügen
-Wie genau kann ich das machen? Habe leider noch nicht viel Erfahrung mit css & html.
(How exactly can I do that? I don´t have much experience with css &html.)

#2 von @torsten Landsiedel:
Child Theme ist erstellt.
Wie genau muss ich nun den Header anpassen? In der functions.php, oder in der header.php? Habe das Tesseract Theme.

#3 von @edi Goetschel:
Wie genau meinst Du das? Soll ich nun quasi eine neue Seite erstellen, deren Inhalt nur der Sprachumschaltzer wäre, und die dann oben im Menü verlinken?
Die Lösung fände ich nicht so elegant… Oder ist das anders gemeint?

Vielen Dank für die Antworten!
Gruß
Jannis Oing
Martin Robbins
(@santeven)

vor 8 Jahre
I believe the answer from Edi is the most simple. From within Dashboard > Appearance> Menus … You should be able to add the language switcher as a menu item into your primary menu, usually located in the header.

For over-simplified example try this link: http://wpmulti.org/wpmulti-is-an-acronym/ … And then click „Deutsch“

For a more robust solution, the answer from torsten is perhaps an improvement beyond my first answer. You would however likely need to understand how to create and edit the child theme file header.php, by studying the reference documents provided by Torsten.

You could try insert this code into the child theme header.php file:
________________

Ich glaube, die Antwort von Edi ist die einfachste. Aus Dashboards> Darstellung> Menüs … Sie sollten in der Lage, um den Sprachumschalter als Menüpunkt in Ihrem primären Menü, in der Regel in der Kopfzeile befindet hinzuzufügen.

Für stark vereinfachte Beispiel versuchen Sie diesen Link: http://wpmulti.org/wpmulti-is-an-acronym/ … Und dann klicken Sie auf „Deutsch“

Für eine robuste Lösung, ist die Antwort von torsten vielleicht eine Verbesserung über meine erste Antwort. Sie würden aber wahrscheinlich benötigen, um zu verstehen, wie das Erstellen und bearbeiten Sie die Datei header.php Kind Thema, durch das Studium der Referenzdokumente von Torsten bereitgestellt.

Sie könnten versuchen, diesen Code einfügen in das Kind Thema header.php Datei:
```
<?php // outputs a list of languages names ?>
<ul><?php pll_the_languages(); ?></ul>

<?php // outputs a flags list (without languages names) ?>
<ul><?php pll_the_languages(array('show_flags'=>1,'show_names'=>0)); ?></ul>

<?php // outputs a dropdown list of languages names ?>
<?php pll_the_languages(array('dropdown'=>1));  ?>
```
Thread-Starter Trialstyle98
(@trialstyle98)

vor 8 Jahre

Ok, now I understand what Edi meant. That would be a soultion but I think it´s not so elegant…

Where exactly would I have to paste the code?
Thx for your answer!

Martin Robbins
(@santeven)

vor 8 Jahre

Perhaps you might try Edi solution on your site before you make a decision, my example is rather crude to say the least.

Where exactly would I have to paste the code?

You could try insert this code into the child theme header.php file:

Other than that it’s the same answer as Edi gave.

Es kommt darauf an, wo Du im Header den Sprachenumschalter positionieren willst.

I couldn’t find the tesseract theme in wordpress.org repository , or I would have a look and attempt further guidance. If you want to post here the contents of file header.php, enclosed in backticks, I will …
Thread-Starter Trialstyle98
(@trialstyle98)

vor 8 Jahre
It wouldn´t fit in my site, as I have in my Header Menu:
Home, Blog, About, Vidoes, Photos, Contact… and the Deutsch and Englisch..?
I think that would not look nice…

I got it from here: http://tyler.com/tesseract-theme/
Here is my header.php:
```
<?php
/**
 * The header for our theme.
 *
 * Displays all of the <head> section and everything up till <div id="content">
 *
 * @package Tesseract
 */
?><!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
<meta name="google-site-verification" content="34wzOH5RvknFaLqaBxQi9ZJaZGUoLaCVvcn7sj_FtdU" />
<meta name="google-site-verification" content="y42zQvI_f2UWiqEJe74loTtdpqEmjYVW15aOy9nsv-A" />
<meta charset="<?php bloginfo( 'charset' ); ?>">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="profile" href="http://gmpg.org/xfn/11">
<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>">

<?php wp_head(); ?>

<link href="/wp-content/uploads/2015/04/favicon.ico" rel="shortcut icon"/>
</head>

<body <?php body_class(); ?>>

<nav id="mobile-navigation" class="top-navigation" role="navigation">

	<?php $anyMenu = get_terms( 'nav_menu' ) ? true : false;
    	  $menuSelect = get_theme_mod('tesseract_tho_header_menu_select');

		if ( $anyMenu && ( ( $menuSelect ) && ( $menuSelect !== 'none' ) ) ) :
			wp_nav_menu( array( 'menu' => $menuSelect, 'container_class' => 'header-menu' ) );
		elseif ( $anyMenu && ( !$menuSelect || ( $menuSelect == 'none' ) ) ) :
			$menu = get_terms( 'nav_menu' );
			$menu_id = $menu[0]->term_id;
			wp_nav_menu( array( 'menu_id' => $menu_id ) );
		elseif ( !$anyMenu ) :
			wp_nav_menu( array( 'theme_location' => 'primary', 'menu_class' => 'nav-menu' ) );
		endif; ?>

</nav>  	

<div id="page" class="hfeed site">
	<a class="skip-link screen-reader-text" href="#content"><?php _e( 'Skip to content', 'tesseract' ); ?></a>

    <a class="menu-open dashicons dashicons-menu" href="#mobile-navigation"></a>
    <a class="menu-close dashicons dashicons-no" href="#"></a>            

	<header id="masthead" class="site-header <?php echo get_header_image() ? 'is-header-image' : 'no-header-image'; ?>" role="banner">

    <?php $logoImg = get_theme_mod('tesseract_logo_image');
	$blogname = get_bloginfo('blogname');
	$headright_content = get_theme_mod('tesseract_tho_header_content_content');
	$headright_content_default_button = get_theme_mod('tesseract_tho_header_content_if_button');

	if ( !$logoImg && $blogname ) $brand_content = 'blogname';
	if ( $logoImg ) $brand_content = 'logo';
	if ( !$logoImg && !$blogname ) $brand_content = 'no-brand'; 

	?>

        <div id="site-banner" class="cf<?php echo ' ' . $headright_content . ' ' . $brand_content; echo ( ( $headright_content  ) && ( $headright_content !== 'nothing' ) ) ?  ' is-right' : ' no-right'; ?>">               

            <div id="site-banner-left" class="<?php echo ( ( $headright_content  ) && ( $headright_content !== 'nothing' ) ) ?  'is-right' : 'no-right'; ?>">

                <?php if ( $logoImg || $blogname ) { ?>
                    <div class="site-branding">
                        <?php if ( $logoImg ) : ?>
                            <h1 class="site-logo"><a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home"><img src="<?php echo $logoImg; ?>" alt="logo" /></a></h1>
                        <?php else : ?>
                            <h1 class="site-title"><a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a></h1>
                        <?php endif; ?>
                    </div>
              	<?php } ?>

                <nav id="site-navigation" class="main-navigation top-navigation" role="navigation">

					<?php $anyMenu = get_terms( 'nav_menu' ) ? true : false;
                          $menuSelect = get_theme_mod('tesseract_tho_header_menu_select');

						if ( $anyMenu && ( ( $menuSelect ) && ( $menuSelect !== 'none' ) ) ) :
							wp_nav_menu( array( 'menu' => $menuSelect, 'container_class' => 'header-menu' ) );
						elseif ( $anyMenu && ( !$menuSelect || ( $menuSelect == 'none' ) ) ) :
							$menu = get_terms( 'nav_menu' );
							$menu_id = $menu[0]->term_id;
							wp_nav_menu( array( 'menu_id' => $menu_id ) );
						elseif ( !$anyMenu ) :
							wp_nav_menu( array( 'theme_location' => 'primary', 'menu_class' => 'nav-menu' ) );
						endif; ?>

				</nav> 

            </div>

            <?php if ( $headright_content ) : ?>            

               	<div id="site-banner-right">

					<?php tesseract_header_right_content($headright_content); ?>                  

             	</div>

			<?php elseif ( !$headright_content && $headright_content_default_button ) : ?>            

            	<div id="site-banner-right">

                    <div id="header-button-container">
                        <div id="header-button-container-inner">
                            <?php echo $headright_content_default_button; ?>
                        </div>
                    </div> 

               </div>

            <?php else : ?>

				<div id="site-banner-right">

                	<div id="header-button-container">
                    	<div id="header-button-container-inner">
                        	<a href="/" class="button primary-button">Primary Button</a>
                    		<a href="/" class="button secondary-button">Secondary Button</a>
                		</div>
                   	</div>
                </div>				

			<?php endif; ?>

        </div>            

	</header>

    <div id="content" class="cf site-content">
```
Moderator Torsten Landsiedel
(@zodiac1978)

vor 8 Jahre

Please use the German language here. It is the German support forum.

For english support you can user the English support forums:
https://wordpress.org/support/

Thank you!

Thread-Starter Trialstyle98
(@trialstyle98)

vor 8 Jahre

Stimmt, tut mir leid. Übersetze ab jetzt alles dann auch ins Deutsche.
Vielen Dank!

Martin Robbins
(@santeven)

vor 8 Jahre

Theme Tesseract is robust and sophisticated. I am reluctant to suggest direct modifications to theme files at this time.

I’ve integrated the Polylang language switcher at three locations in theme Tesseract, all without editing any theme files. In the header and footer as a menu item, in the sidebar as a widget.

Please see http://wpmulti.org/ …
And be sure to browse around and see the display modifications for various display types: index, static page, category archive, and single post.

https://translate.google.com
Theme Tesseract ist robust und anspruchsvoll. Es widerstrebt mir, direkte Änderungen an Stildateien zu diesem Zeitpunkt vor.

Ich habe die Polylang Sprachumschalter an drei Standorten in Thema Tesseract, integriert alle ohne Bearbeitung keine Designdateien. In der Kopf- und Fußzeile als Menüpunkt in der Seitenleiste als Widget.

Bitte beachten Sie http://wpmulti.org/ …
Und achten Sie darauf, um zu sehen und sehen die Anzeige Modifikationen für verschiedene Darstellungsarten: index, statische Seite, Kategorie-Archiv und einzigen Beitrag.

Thread-Starter Trialstyle98
(@trialstyle98)

vor 8 Jahre

Now I got it!
In the options I had to activate „Sprachenumschalter“ and then I could just put it in the Menu like I wanted to…!
Thx for your help!
One little Problem, I still have:
The Sprachumschalter is directly after the „normal“ Menu..
How can I get it to the right next to the social Icons?
Here a Picture:
http://www.picfront.org/d/9hH7

Jetzt ahb ich es verstanden!
In den Optionen musste ich „Sprachumschalter“ aktivieren, dann konnte ich ihn einfach im Menu einfügen, wie ich das wollte.
Danke für deine Hilfe!
Ein kleines Problem, das ich noch habe:
Der Sprachumschalter erscheint direkt hinter dem „normalen“ Menu.. Wie bekomme ich ihn weiter nach rechts, neben die social Icons?
Hier ein Bild:
http://www.picfront.org/d/9hH7
Martin Robbins
(@santeven)

vor 8 Jahre
As I understand the polylang language switcher, it can be implemented via at least three distinct methods:
1. menu item
2. widget
3. php code insertion
I got it from here: http://tyler.com/tesseract-theme/

Regarding theme Tessarct, my knowledge is limited. I found it not facile to create sophisticated polylang setup with language specific menu for each language. So for that theme best to check the support might be available from Tyler Moore, the theme author. And since you have English, you might find a greater knowledge base in the english theme forum: https://wordpress.org/support/forum/themes-and-templates

However, I have been able to do what I wanted rather easily with polylang integrated into theme TwentyFifteen , and it demonstrates the difference between the menu item and the widget implementations:

http://wpmulti.org/
__________________
https://translate.google.com

Als ich die Polylang Sprachumschalter verstehen, kann diese über mindestens drei verschiedene Methoden realisiert werden:
1. Menüpunkt
2. Widget
3. PHP-Code Insertion
Ich habe es von hier: http://tyler.com/tesseract-theme/

In Bezug auf Thema Tessarct, mein Wissen begrenzt. Ich fand es nicht leicht, anspruchsvolle Polylang Setup mit sprachspezifischen Menü für jede Sprache erstellen. So für dieses Thema am besten, um zu überprüfen der Träger könnte die von Tyler Moore, dem Thema Autor sein. Und da Sie Englisch haben, können Sie eine größere Wissensbasis im Englisch Thema Forum zu finden: https://wordpress.org/support/forum/themes-and-templates

Allerdings habe ich in der Lage zu tun, was ich wollte, und nicht einfach mit Polylang in Thema TwentyFifteen integriert und die Differenz zwischen dem Menüpunkt und den Widget-Implementierungen veranschaulicht:

http://wpmulti.org/
Edi
(@psychosopher)

vor 8 Jahre
Der Sprachumschalter erscheint direkt hinter dem „normalen“ Menu.. Wie bekomme ich ihn weiter nach rechts, neben die social Icons?

Du kannst mit CSS definieren:
```
.lang-item {
  float: right;
  margin-right: 40px;
}

@media screen and (max-width: 620px) {

  .lang-item {
  float: left;
  margin-right: 0;
  }

}
```
Das machst Du am besten im Child Theme. Oder mit einem Plugin wie Simple Custom CSS:

https://wordpress.org/plugins/simple-custom-css/

Auch „Individuelles CSS“ des Plugins Jetpack kannst Du dafür verwenden:

https://wordpress.org/plugins/jetpack/

Ansicht von 15 Antworten - 1 bis 15 (von insgesamt 17)

1 2 →

Das Thema „Tesseract Theme Widget in Header“ ist für neue Antworten geschlossen.

Themen-Schlagwörter

Ansichten