Beiträge von Spawnsplitter

Spawnsplitter

PHP

$this->add_control(
        "column_distribution",
        [
            "label" => esc_html__("Spalten Verteilung", "elementor"),
            "type" => \Elementor\Controls_Manager::TEXT,
            "description" => esc_html__("Trennen Sie die Spalten mit einem , ohne Leerzeichen. ", "elementor"),
            "default" => "1"
        ]
    );








protected function zählenDerColumns($dis, $elementCount) {
    $data = explode(",", $dis);
    $ergebnis = array();
    $dataCount = 0;
    foreach($data as $elem) {
        $item = intval($elem);
        $dataCount += $item;
        $ergebnis[] = $item;
    }
    if ($dataCount != $elementCount) {
        return 0;
    } else {
        return $ergebnis;
    }
}


protected function render() {
    $settings = $this->get_settings_for_display();
    $fallback_defaults = [
        'fa fa-check',
        'fa fa-times',
        'fa fa-dot-circle-o',
    ];


    $this->add_render_attribute( 'icon_list', 'class', 'elementor-icon-list-items' );
    $this->add_render_attribute( 'list_item', 'class', 'elementor-icon-list-item' );


    if ( 'inline' === $settings['view'] ) {
        $this->add_render_attribute( 'icon_list', 'class', 'elementor-inline-items' );
        $this->add_render_attribute( 'list_item', 'class', 'elementor-inline-item' );
    }


    ?>
    <div <?php $this->print_render_attribute_string( 'icon_list' ); ?>>
        <?php
        


        $item_count = count($settings["icon_list"]);




        $daten = $this->zählenDerColumns($settings["column_distribution"],$item_count);
        $datenCount = 0;
        $datenIndex = 0;


        foreach ( $settings['icon_list'] as $index => $item ) :
            
            $repeater_setting_key = $this->get_repeater_setting_key( 'text', 'icon_list', $index );


            $this->add_render_attribute( $repeater_setting_key, 'class', 'elementor-icon-list-text' );


            $this->add_inline_editing_attributes( $repeater_setting_key );
            $migration_allowed = \Elementor\Icons_Manager::is_migration_allowed();


            if($datenCount == 0) {
                ?> <div> <?php ;
            }
            ?>
            <span class="elementor-icon-list-item elementor-inline-item elementor-repeater-item-<?php echo esc_attr($item["_id"]);?> inner-item">
                <?php
                if ( ! empty( $item['link']['url'] )) {
                    $link_key = 'link_' . $index;   
                    $this->add_link_attributes( $link_key, $item['link'] );
                    ?>
                    <a <?php $this->print_render_attribute_string( $link_key ); ?>>
                    <?php
                }
                if ( ! isset( $item['icon'] ) && ! $migration_allowed ) {
                    $item['icon'] = isset( $fallback_defaults[ $index ] ) ? $fallback_defaults[ $index ] : 'fa fa-check';
                }


                $migrated = isset( $item['__fa4_migrated']['selected_icon'] );
                $is_new = ! isset( $item['icon'] ) && $migration_allowed;
                if ( ! empty( $item['icon'] ) || ( ! empty( $item['selected_icon']['value'] ) && $is_new ) ) :
                    ?>
                    <span class="elementor-icon-list-icon">
                        <?php
                        if ( $is_new || $migrated ) {
                            \Elementor\Icons_Manager::render_icon( $item['selected_icon'], [ 'aria-hidden' => 'true' ] );
                        } else { ?>
                                <i class="<?php echo esc_attr( $item['icon'] ); ?>" aria-hidden="true"></i>
                        <?php } ?>
                    </span>
                <?php endif; ?>
                <span <?php $this->print_render_attribute_string( $repeater_setting_key ); ?>> </span>
                <?php if ( ! empty( $item['link']['url'] )) : ?>
                    </a>
                <?php endif; ?>
                </span>
            <?php


            if ($daten == 0 || $datenCount+1 == $daten[$datenIndex]) {
                ?> </div> <?php ;
                $datenCount = 0;
                $datenIndex++;
            }
            else $datenCount++;
            endforeach;     
            ?>       
    </div>
    <?php
}

Alles anzeigen

Spawnsplitter

Oke habe es jz zumindest geschafft die divs in columns aufzuteilen haha

Spawnsplitter

[COLOR=#ff0000]Zitat gelöscht. Das Folgende bezieht sich auf den vorhergehenden Post.[/COLOR]

Das Problem ist das unser Ausbilder die devise verfolgt uns nicht zu helfen, sonst würden wir nichts lernen. Hab ich nämlich tatsächlich schon versucht haha. Er meinte der Sinn dahinter wäre das die emt klassen keine oder nur geringe Auswirkungen auf den Page Speed haben, und normales CSS eine Website extrem verlangsamen würde. Aber danke für den Tipp ich versuche es mal

Spawnsplitter

Zitat von threadi

Wieso sprichst Du von divs wenn ich schreibe, dass die dort nichts zu suchen haben?

[COLOR=#ff0000]Vollzitat gekürzt[/COLOR].

Das diese Optionen bestehen weis ich, das wäre auch kein Problem. Aber mein Ausbilder meint ich darf nicht mit CSS arbeiten sondern wenn nur mit den CSS Klassen von Elementor die so gut wie nirgends dokumentiert sind. Von Ihm kommt auch die Vorgabe <div> zu verwenden...

Spawnsplitter

Zitat von threadi

Der erzeugte HTML-Code ist nicht valide. Entferne die <div>-Elemente um die <li>. Ein <li> darf nur innerhalb eines <ul> oder <ol> oder <menu> liegen. Siehe: https://developer.mozilla.org/en-US/docs/Web…etiredLocale=de
Ich verstehe dann weiterhin nicht was für ein "Gap" du meinst. Es gibt hier keinerlei Columns, nur Listenpunkte. Willst Du bei bestimmten Listenpunkten den visuellen Abstand erhöhen?

Genau das ist ja mein punkt ich soll jz zum Beispiel 2 div in eine column packen dann wieder 3 div in eine column und dann 2 und dann zwischen den columns einen abstand

Spawnsplitter

Zitat von meisterleise

Weil das wahrscheinlich eine Übungsaufgabe für den Azubi ist. So kommt es mir zumindest vor.

Genau
Wie gesagt bin ich Azubi im ersten Lehrjahr

Spawnsplitter

Also ich soll das Menü von Hand aufbauen um den Page Speed auf 100 zu halten

Spawnsplitter

Zitat von b3317133

Was genau ist mit Column Gap gemeint? Ein Abstand zum nächsten div?
Versuchst Du manuell ein Menü nachzubauen? Dafür gibt es in WordPress eigentlich andere Wege, mit entspr. CSS Klassen usw. zur Formatierung nach Wunsch.

Mit Column Gap meine ich einen Abstand zwischen collums die mehrere divs enthalten. Und ja das ist mein Ziel. Ich weis auch das es andere Wege gibt dafür. Aber ich darf leider kein eigenes CSS benutzen sondern nur die von Elementor mitgegebenen Elemente und Klassen.

Spawnsplitter

Hier erst einmal noch der Link zu meiner Wordpress Seite dann kann man sich das Ergebnis doch anschauen. https://kr-wp.bejoynt.de/wordpress/?page_id=15
Ich muss nach dem Punkt Tischreservierung eine Column Gap einrichten.
So nun dürfte mein Problem auch deutlich sein. haha

Spawnsplitter

PHP

protected function render() {
    $settings = $this->get_settings_for_display();
    $fallback_defaults = [
        'fa fa-check',
        'fa fa-times',
        'fa fa-dot-circle-o',
    ];


    $this->add_render_attribute( 'icon_list', 'class', 'elementor-icon-list-items' );
    $this->add_render_attribute( 'list_item', 'class', 'elementor-icon-list-item' );




    if ( 'inline' === $settings['view'] ) {
        $this->add_render_attribute( 'icon_list', 'class', 'elementor-inline-items' );
        $this->add_render_attribute( 'list_item', 'class', 'elementor-inline-item' );
    }
    ?>


    <ul <?php $this->print_render_attribute_string( 'icon_list' ); ?>>
        <?php


        foreach ( $settings['icon_list'] as $index => $item ) :


            $repeater_setting_key = $this->get_repeater_setting_key( 'text', 'icon_list', $index );


        echo '<div>';


            $this->add_render_attribute( $repeater_setting_key, 'class', 'elementor-icon-list-text' );


            $this->add_inline_editing_attributes( $repeater_setting_key );
            $migration_allowed = \Elementor\Icons_Manager::is_migration_allowed();
            ?>
            <li <?php $this->print_render_attribute_string( 'list_item' ); ?>>
                <?php
                if ( ! empty( $item['link']['url'] ) ) {
                    $link_key = 'link_' . $index;


                    $this->add_link_attributes( $link_key, $item['link'] );
                    ?>
                    <a <?php $this->print_render_attribute_string( $link_key ); ?>>


                    <?php
                }


                // add old default
                if ( ! isset( $item['icon'] ) && ! $migration_allowed ) {
                    $item['icon'] = isset( $fallback_defaults[ $index ] ) ? $fallback_defaults[ $index ] : 'fa fa-check';
                }


                $migrated = isset( $item['__fa4_migrated']['selected_icon'] );
                $is_new = ! isset( $item['icon'] ) && $migration_allowed;
                if ( ! empty( $item['icon'] ) || ( ! empty( $item['selected_icon']['value'] ) && $is_new ) ) :
                    ?>
                    <span class="elementor-icon-list-icon">
                        
                        <?php
                        if ( $is_new || $migrated ) {
                            \Elementor\Icons_Manager::render_icon( $item['selected_icon'], [ 'aria-hidden' => 'true' ] );
                        } else { ?>
                                <i class="<?php echo esc_attr( $item['icon'] ); ?>" aria-hidden="true"></i>
                        <?php } ?>
                    </span>
                <?php endif; ?>
                <span <?php $this->print_render_attribute_string( $repeater_setting_key ); ?>><?php $this->print_unescaped_setting( 'text', 'icon_list', $index ); ?></span>
                <?php if ( ! empty( $item['link']['url'] ) ) : ?>
                    </a>
                <?php endif; ?>
            </li>


        </div>
            <?php
        endforeach;
        ?>
    </ul>


    <?php
}

Alles anzeigen

Das ganze ist ein Elementor Widget, deshalb wird das mit der Ausgabe etwas schwierig. Mein Problem liegt darin, dass dieses Widget eine Top-Bar darstellen soll die in der Mitte über eine Column Gap verfügt. Die Einträge (<span>) werden über eine foreach Schleife generiert. Mein Problem besteht jetzt darin, das ich absolut nicht weis wie ich die generierten spans in mehrere Columns unterteilen kann um dann den Abstand zwischen den Columns einzustellen

Spawnsplitter

Zitat von meisterleise

Nö. Der Sinn eines Titels ist, dem potentiellen Helfer in Kurzform anzudeuten, worum es geht, damit er schon VOR dem Öffnen des Beitrags weiß, ob er dazu Hilfe beisteuern kann oder nicht. Oder meinst du, dieses Forum würde noch funktionieren, wenn jeder seinen Titel nur noch "Komme nicht weiter", "Weiß nicht wie das geht", "I[COLOR=#ff4d4d]ch bin blöd und habe keine Ahnung" nennt?[/COLOR]

Falls ich das falsch verstanden habe, tut es mir natürlich leid

Spawnsplitter

Das ist ja oke, aber wenn jeder gleich beleidigend wird, würde das Forum auch nicht mehr funktionieren. Tut mir leid das ich leider erst in meiner Ausbildung bin und noch nicht zu 100% Bescheid weis.

Spawnsplitter

Deshalb ist es nur der Titel und in der Beschreibung steht dann alles genau !

Spawnsplitter

Hey und zwar bin ich aktuell dabei ein neues Plugin für Elementor zu entwickeln. Mein Problem liegt nun darin das ich eine foreach Schleife in mehrere columns unterteilen möchte.

protected function render() {
$settings = $this->get_settings_for_display();
$fallback_defaults = [
'fa fa-check',
'fa fa-times',
'fa fa-dot-circle-o',
];

$this->add_render_attribute( 'icon_list', 'class', 'elementor-icon-list-items' );
$this->add_render_attribute( 'list_item', 'class', 'elementor-icon-list-item' );

if ( 'inline' === $settings['view'] ) {
$this->add_render_attribute( 'icon_list', 'class', 'elementor-inline-items' );
$this->add_render_attribute( 'list_item', 'class', 'elementor-inline-item' );
}
?>

<ul <?php $this->print_render_attribute_string( 'icon_list' ); ?>>
<?php

foreach ( $settings['icon_list'] as $index => $item ) :
echo '<div class="second-wrapper">';
$repeater_setting_key = $this->get_repeater_setting_key( 'text', 'icon_list', $index );

echo '<div class="inner-wrapper">';

$this->add_render_attribute( $repeater_setting_key, 'class', 'elementor-icon-list-text' );

$this->add_inline_editing_attributes( $repeater_setting_key );
$migration_allowed = \Elementor\Icons_Manager::is_migration_allowed();
?>
<span <?php $this->print_render_attribute_string( 'list_item' ); ?>>
<?php
if ( ! empty( $item['link']['url'] ) ) {
$link_key = 'link_' . $index;

$this->add_link_attributes( $link_key, $item['link'] );
?>
<a <?php $this->print_render_attribute_string( $link_key ); ?>>

<?php
}

// add old default
if ( ! isset( $item['icon'] ) && ! $migration_allowed ) {
$item['icon'] = isset( $fallback_defaults[ $index ] ) ? $fallback_defaults[ $index ] : 'fa fa-check';
}

$migrated = isset( $item['__fa4_migrated']['selected_icon'] );
$is_new = ! isset( $item['icon'] ) && $migration_allowed;
if ( ! empty( $item['icon'] ) || ( ! empty( $item['selected_icon']['value'] ) && $is_new ) ) :
?>
<span class="elementor-icon-list-icon">

<?php
if ( $is_new || $migrated ) {
\Elementor\Icons_Manager::render_icon( $item['selected_icon'], [ 'aria-hidden' => 'true' ] );
} else { ?>
<i class="<?php echo esc_attr( $item['icon'] ); ?>" aria-hidden="true"></i>
<?php } ?>
</span>
<?php endif; ?>
<span <?php $this->print_render_attribute_string( $repeater_setting_key ); ?>><?php $this->print_unescaped_setting( 'text', 'icon_list', $index ); ?></span>
<?php if ( ! empty( $item['link']['url'] ) ) : ?>
</a>
<?php endif; ?>
</span>
</div>
</div>
<?php
endforeach;
?>
</ul>

hätte hier jemand eventuell eine Idee wie ich zum beispiel 2 der spans in einen div packen kann dann wieder 3 in einen und so weiter ?

Willkommen! Melden Sie sich an oder registrieren Sie sich.

Beiträge von Spawnsplitter

Hilfe !! ich komm nicht weiter

Hilfe !! ich komm nicht weiter

Hilfe !! ich komm nicht weiter

Hilfe !! ich komm nicht weiter

Hilfe !! ich komm nicht weiter

Hilfe !! ich komm nicht weiter

Hilfe !! ich komm nicht weiter

Hilfe !! ich komm nicht weiter

Hilfe !! ich komm nicht weiter

Hilfe !! ich komm nicht weiter

Hilfe !! ich komm nicht weiter

Hilfe !! ich komm nicht weiter

Hilfe !! ich komm nicht weiter

Hilfe !! ich komm nicht weiter