Hilfe bei Erstellung eines simplen Plugins

digiblogger
(@digiblogger)

vor 5 Jahren, 4 Monaten
Hallo,

ich brauche mal eure Hilfe, weil ich mich mit Plugin Entwicklung nicht auskenne, obwohl ich weiß, dass das hier wahrscheinlich ein Kinderspiel ist.

Ich möchte gerne eine Suchbox erstellen, die ich per Shortcode [tsbox] ausgeben will.

Die Ausgabe soll so erfolgen:

<input type='text' onkeyup="filterTo(this.value, 'IDderTabelle')" placeholder='SuchtextPlatzhalter'>

„IDderTabelle“ und „SuchtextPlatzhalter“ sollen Shortcode Attribute sein. Entsprechend soll der Shortcode später so aussehen. Prima wäre ein weiteres Attribut wie CSSKLasse, sodass ich mehrere Design erstellen kann.

Der Shortcode soll später vollständig so aussehen:

[tsbox id="IDderTabelle" class="main" placeholder="SuchtextPlatzhalter"]

IDderTabelle = ID der Tabelle, die gefiltert werden soll
main = die CSS-Datei main.css soll geladen werden
SuchtextPlatzhalter = Platzhalter in der Inputbox

Der JavaScript Code dazu wäre dieser:
```
function filterTo(input, table) {
var tr = document.getElementById(table).getElementsByTagName('tr');
for (var i = 1; i < tr.length; i++) {
    var td = tr[i].getElementsByTagName('td');
    var hide = true;
    for (var j=0; j<td.length; j++) { 
        if (td[j].innerHTML.toUpperCase().indexOf(input.toUpperCase()) > -1) { hide=false; break } 
    }
    tr[i].style.display = hide ? 'none' : '';
} }
```
Könnte mir jemand einen „table-searchbox.php“, „table-searchbox.js“ und „table-searchbox.css“ einbinden, sodass ich die drei Dateien nur noch hochladen und als Plugin im Ordner /plugins/table-searchbox verwenden kann.

Das CSS-Stylen würde ich natürlich selbst übernehmen.

Ich möchte das Ganze dann gern der Community zur Verfügung stellen und kostenlos ins Plugin Verzeichnis hochladen. Außerdem möchte ich an diesem Beispiel gern lernen, wie Shortcodes funktionieren.
- Dieses Thema wurde geändert vor 5 Jahren, 4 Monaten von digiblogger.

Ansicht von 3 Antworten - 1 bis 3 (von insgesamt 3)

Thread-Starter digiblogger
(@digiblogger)

vor 5 Jahren, 4 Monaten
Ich bin nun ein bisschen weiter und habe es geschafft, dass die Parameter im Shortcode übergeben werden.
```
// Usage: 
// [tablesearch id="MyTable" css="main" placeholder="Search something"]
// Creates a small color swatch

function shortcode_tablesearch( $atts ){
    $atts = shortcode_atts( array(
        'id' => 'MyTable',
		'class' => 'main',
		'placeholder' => 'Search something',
    ), $atts, 'tablesearch' );
    
	return '<input class="'. $atts['class'].'" type="text" onkeyup="filterTo(this.value,'. $atts['id'].')" placeholder="'.$atts['placeholder'].'">';
}
add_shortcode( 'tablesearch', 'shortcode_tablesearch' );
```
Den Code (s.o.) für die Javascript-Datei habe ich in eine tablesearch.js im gleichen Verzeichnis.

Diese rufe ich vor dem Shortcode Block in der tablesearch.php auf, und zwar so:
```
add_action('wp_enqueue_scripts','tablesearch_init');

function tablesearch_init() {
    wp_enqueue_script( 'tablesearch-init', plugins_url( '/tablesearch.js', __FILE__ ));
}
```
Die Funktion wird aber nicht angewendet.

Was mache ich falsch beim Laden des JS??
- Diese Antwort wurde geändert vor 5 Jahren, 4 Monaten von digiblogger.
Thread-Starter digiblogger
(@digiblogger)

vor 5 Jahren, 4 Monaten

Ich habe das Problem identifiziert, aber brauche immer noch eine Lösung dazu.

[tablesearch id=“meineTabelle class=“main“ placeholder=“text“]

return '<input class="'. $atts['class'].'" type="text" onkeyup="filterTo(this.value,'. $atts['id'].')" placeholder="'.$atts['placeholder'].'">';

erzeugt die Ausgabe

`<input class=“main“ type=“text“ onkeyup=“filterTo(this.value,“ meinetabelle“)“=““ placeholder=“search something“>

Wie kriege ich
a) das Leerzeichen vor heldenstufeltabelle weg
b) es hin, dass meineTabelle nicht zu meinetabelle wird
c) dieses =““ weg

Moderator Torsten Landsiedel
(@zodiac1978)

vor 5 Jahren, 4 Monaten

[tablesearch id="meineTabelle class="main" placeholder="text"]

Da fehlt ein Anführungszeichen nach meineTabelle. Geht es dann?

Gruß, Torsten

Ansicht von 3 Antworten - 1 bis 3 (von insgesamt 3)

Das Thema „Hilfe bei Erstellung eines simplen Plugins“ ist für neue Antworten geschlossen.

Ansichten