Ga naar hoofdinhoud

Maak pixel-perfect responsieve Joomla-tabellen op mobiel

De responsieve modus is iets cruciaals om HTML-tabellen op Joomla weer te geven, met soms weinig ruimte in je lay-out, of je nu op een desktop of op kleine apparaten (mobielen, tablets) bent. Droptables heeft 3 responsieve modi: Scrollen, Kolommen verbergen en Herhaalde kop met verschillende responsieve instellingen.
Voor meer functies, ga terug naar de hoofd-pluginpagina >

Responsieve tabel met kolomverbergen en weergaveprioriteit

Responsieve tabel met kolomverbergen en weergaveprioriteit

Deze Droptables responsieve modus is de meest en meest aanpasbare. Uw tabel wordt weergegeven met een kolomselectie gesorteerd op prioriteit, de andere worden verborgen, afhankelijk van de beschikbare breedte. U kunt een kolomweergave forceren op elk schermformaat met een menu met selectievakje. 

Responsieve tabel met dataheader-groepmodus

Deze responsieve modus van de tabel toont, zodra een bepaalde schermbreedte is bereikt, rijgegevens onder de headerinformatie. Je kunt een specifiek responsief breekpunt (breedte) en maximale tabelhoogte voor elke tabel instellen, wat zeer handig is, afhankelijk van waar je tabel geplaatst is.

Responsieve tabel met dataheader-groepmodus
Responsieve tabel met scrollen

Responsieve tabel met scrollen

De scroll-responsieve modus stelt de tabelbreedte en -hoogte vast en toont vervolgens overloop, zowel horizontaal als verticaal. Het horizontale scrollen hangt af van de breedte van uw inhoud en u kunt selecteren hoeveel kolommen bevroren blijven tijdens het scrollen.

Hoe kies je de juiste responsieve modus voor uw HTML-tabellen

Alle hier vermelde responsieve modi kunnen worden gebruikt met cel- of kolombevriezing en tabellen met vaste breedte en hoogte. Alle responsieve modi kunnen relevant zijn, afhankelijk van de weergegeven gegevens en de meest gebruikte apparaten.

Hoe kies je de juiste responsieve modus voor uw HTML-tabellen
Droptables extensieprijzen

Word lid van onze 60,000+ leden & krijg ondersteuning en nieuwe versie‑updates

HEB JE EEN LIDMAATSCHAP? UPGRADEN VAN JE ACCOUNT
PRO
EXTENSIE + 1 JAAR ONDERSTEUNING & UPDATE
$44
1
jaar
  • MEERDOMEIN / MEER SITE
  • 1 JAAR UPDATE
  • 1 JAAR ONDERSTEUNING
  • Dropfiles-extensie
  • Droppics-extensie
  • DropEditor integratie
  • GEEN TERUGKERENDE BETALING
  • GEEN DATUMBEPERKING
  • Nieuwste Joomla 3, 4 & 5 klaar
Bestel nu
BESTE AANBOD
BUNDEL
DROPPICS + DROPFILES + DROPTABLE + DROPEDITOR
$69
1
JAAR
SPECIAAL PAKKET
  • MEERDOMEIN / MEER SITE
  • 1 JAAR UPDATE
  • 1 JAAR ONDERSTEUNING
  • Dropfiles-extensie
  • Droppics-extensie
  • DropEditor integratie
  • GEEN TERUGKERENDE BETALING
  • GEEN DATUMBEPERKING
  • Nieuwste Joomla 3, 4 & 5 klaar
Bestel nu
199$
In plaats van 462$
HAAL DE 
JOOMLA BUNDEL

De bundel geeft toegang tot ALLE Joomla-extensies en kan op alle websites worden gebruikt. Bovendien heeft u volledige toegang tot technische ondersteuning en updates voor elke extensie gedurende het hele jaar. 
De tijd is nu! Verhoog uw efficiëntie en krijg dat concurrentievoordeel. Probeer de bundel.

MEER INFORMATIE

Klantengetuigenissen & Beoordelingen

Droptables Droptables - Joomla Tabelbeheer
90 van 100 gebaseerd op 16 gebruikersbeoordelingen

Beoordelingsbron: 16 door gebruikers ingediende recensies op: Joomla.org

FAQ: Responsieve HTML-tabellen op mobiel met Droptables

Wat maakt Droptables-tabellen responsief op mobiel?

Droptables gebruikt geavanceerde responsieve lay-outs en CSS-technieken om ervoor te zorgen dat uw Joomla HTML-tabellen er geweldig uitzien en perfect functioneren op elk mobiel of tabletapparaat zonder horizontaal scrollen.

Kan ik het tabelontwerp aanpassen voor mobiele apparaten?

Ja, u kunt tabelkleuren, lettertypen, randen en lay-out specifiek voor mobiele weergaven aanpassen met Droptables’ visuele editor en responsieve opties.

Ondersteunt Droptables sorteren en filteren op mobiel?

Absoluut, alle interactieve functies zoals kolomsortering, filteren en zoeken blijven volledig functioneel op mobiele apparaten voor de beste gebruikerservaring.

Hoe gaat Droptables om met brede tabellen op kleine schermen?

Droptables biedt slimme afkapping, kolomverbergen en een adaptieve schakelaar tussen horizontaal scrollen en gestapelde weergaven om brede tabellen op kleine schermen naadloos te passen.

Kunnen Droptables-tabellen worden ingebed in artikelen en modules?

Ja, je kunt eenvoudig responsieve tabellen overal in Joomla-inhoud of modules insluiten via shortcode of plug‑inintegratie.

Duplicate entry 'cc46bdf9d2ec3413199a4ce0a0d95031-nl' for key 'bk24_linguise_urls.hash_translation' (500 Whoops, looks like something went wrong.)

mysqli_sql_exception

HTTP 500 Whoops, looks like something went wrong.

Duplicate entry 'cc46bdf9d2ec3413199a4ce0a0d95031-nl' for key 'bk24_linguise_urls.hash_translation'

Exception

mysqli_sql_exception

Show exception properties 
mysqli_sql_exception {#896
  #sqlstate: "23000"
}
in /var/www/staging.joomunited.com/public_html/plugins/system/linguise/vendor/linguise/script-php/src/Databases/Mysql.php (line 170)
  1. foreach ($urls as $translation => $source) {
  2. $elements[] = '("'.mysqli_real_escape_string($this->_database, Request::getInstance()->getLanguage()).'", "'.mysqli_real_escape_string($this->_database, $source).'", "'.mysqli_real_escape_string($this->_database, $translation).'", "'.md5($source).'", "'.md5($translation).'")';
  3. }
  4. $query .= implode(',', $elements);
  5. $query .= ' ON DUPLICATE KEY UPDATE source=VALUES(source), translation=VALUES(translation), hash_source=VALUES(hash_source), hash_translation=VALUES(hash_translation)';
  6. $this->_database->query($query);
  7. }
  9. public function removeUrls($urls)
  10. {
  11. $query = 'DELETE FROM '.mysqli_real_escape_string($this->_database, $this->_database_table_urls).' WHERE (hash_source) IN ';
in /var/www/staging.joomunited.com/public_html/plugins/system/linguise/vendor/linguise/script-php/src/Databases/Mysql.php -> query (line 170)
  1. foreach ($urls as $translation => $source) {
  2. $elements[] = '("'.mysqli_real_escape_string($this->_database, Request::getInstance()->getLanguage()).'", "'.mysqli_real_escape_string($this->_database, $source).'", "'.mysqli_real_escape_string($this->_database, $translation).'", "'.md5($source).'", "'.md5($translation).'")';
  3. }
  4. $query .= implode(',', $elements);
  5. $query .= ' ON DUPLICATE KEY UPDATE source=VALUES(source), translation=VALUES(translation), hash_source=VALUES(hash_source), hash_translation=VALUES(hash_translation)';
  6. $this->_database->query($query);
  7. }
  9. public function removeUrls($urls)
  10. {
  11. $query = 'DELETE FROM '.mysqli_real_escape_string($this->_database, $this->_database_table_urls).' WHERE (hash_source) IN ';
in /var/www/staging.joomunited.com/public_html/plugins/system/linguise/vendor/linguise/script-php/src/Database.php -> saveUrls (line 232)
  2. public function saveUrls($urls) {
  3. if (empty($urls)) {
  4. return;
  5. }
  6. return $this->_database->saveUrls($urls);
  7. }
  9. public function removeUrls($urls) {
  10. if (empty($urls)) {
  11. return;
in /var/www/staging.joomunited.com/public_html/plugins/system/linguise/vendor/linguise/script-php/src/Translation.php -> saveUrls (line 119)
  2. if (isset($result->url_translations)) {
  3. Defer::getInstance()->defer(function() use ($result) {
  4. $new_urls = $result->url_translations;
  5. $new_urls = get_object_vars($new_urls);
  6. Database::getInstance()->saveUrls((array)$new_urls);
  7. });
  8. }
  10. if (isset($result->urls_untranslated)) {
  11. Defer::getInstance()->defer(function() use ($result) {
Translation->Linguise\Script\Core\{closure}()
in /var/www/staging.joomunited.com/public_html/plugins/system/linguise/vendor/linguise/script-php/src/Defer.php call_user_func (line 42)
  1. }
  3. public function finalize()
  4. {
  5. foreach ($this->_actions as $action) {
  6. call_user_func($action['function'], $action['args']);
  7. }
  8. }
  9. }
in /var/www/staging.joomunited.com/public_html/plugins/system/linguise/vendor/linguise/script-php/src/Processor.php -> finalize (line 31)
  1. Helper::prepareDataDir();
  3. // Finalize defer actions on shutdown
  4. // @codeCoverageIgnoreStart
  5. register_shutdown_function(function() {
  6. Defer::getInstance()->finalize();
  7. Database::getInstance()->close();
  8. });
  9. // @codeCoverageIgnoreEnd
  10. }
Processor->Linguise\Script\Core\{closure}()

Stack Trace

mysqli_sql_exception 
mysqli_sql_exception:
Duplicate entry 'cc46bdf9d2ec3413199a4ce0a0d95031-nl' for key 'bk24_linguise_urls.hash_translation'

  at /var/www/staging.joomunited.com/public_html/plugins/system/linguise/vendor/linguise/script-php/src/Databases/Mysql.php:170
  at mysqli->query()
     (/var/www/staging.joomunited.com/public_html/plugins/system/linguise/vendor/linguise/script-php/src/Databases/Mysql.php:170)
  at Linguise\Script\Core\Databases\Mysql->saveUrls()
     (/var/www/staging.joomunited.com/public_html/plugins/system/linguise/vendor/linguise/script-php/src/Database.php:232)
  at Linguise\Script\Core\Database->saveUrls()
     (/var/www/staging.joomunited.com/public_html/plugins/system/linguise/vendor/linguise/script-php/src/Translation.php:119)
  at Linguise\Script\Core\Translation->Linguise\Script\Core\{closure}()
  at call_user_func()
     (/var/www/staging.joomunited.com/public_html/plugins/system/linguise/vendor/linguise/script-php/src/Defer.php:42)
  at Linguise\Script\Core\Defer->finalize()
     (/var/www/staging.joomunited.com/public_html/plugins/system/linguise/vendor/linguise/script-php/src/Processor.php:31)
  at Linguise\Script\Core\Processor->Linguise\Script\Core\{closure}()