Welkom bij Joomla!NL

Om alle mogelijkheden van dit forum te kunnen gebruiken, moet je je eerst registreren.

Vermeld in iedere vraag duidelijk:
  1. De versie van Joomla! 3.X die je gebruikt
  2. De volledige url van je website indien mogelijk.
  3. De versie van de extensie waar de vraag over gaat.

herschalen afbeelding + correcte grootte

herschalen afbeelding + correcte grootte

18 jun 2018 16:00 - 18 jun 2018 17:06
#1
Beste

Ik gebruik template beez3.

Ik heb de afbeelding bovenaan (personal2.png) vervangen door een eigen gemaakte afbeelding van exact dezelfde grootte (1060x288px). Toch wordt deze niet volledig weergegeven.
Hoe komt dit ?

Ik zou de afbeelding graag ook responsive maken, maar in welke css zou dat aangepast moeten worden ?
Ik heb ergens gevonden dat
Code:
img{ height: auto;}

afbeeldingen automatisch herschaald, maar waar zou dit commando dan ingevoegd moeten worden ?


Vriendelijke groeten
Diederik
Edit Astrid: Ik heb de code tussen codetags geplaatst, volgende keer graag zelf doen.
Edit Astrid: Ik heb je topic verplaatst naar het juiste forum.
Laatst bewerkt 18 jun 2018 17:06 door Astrid.
  • diedhert
  • diedhert's berichtenfoto Heeft onderwerp gestart
  • Regelmatige bezoeker van Joomla!NL
  • Regelmatige bezoeker van Joomla!NL
  • Berichten: 191

herschalen afbeelding + correcte grootte

18 jun 2018 17:08 - 18 jun 2018 18:28
#2
Ik neem aan dat je Joomla 3.8.8 gebruikt en niet 2.5?
forum.joomlanl.nl/forum/3-x-templates-en...-afbeelding-in-beez3
:off:
Beez3 is zo ongeveer de slechtste standaard Joomla template die er te vinden is. Als ik jou was zou ik op zoek gaan naar een goede responsive template.
:back:
Groetjes, Astrid
Gebruik de zoekfunctie van dit forum voordat je een nieuwe vraag plaatst.
Vragen uitsluitend via dit forum.
yndi.nl - kvk 17157725
Is je vraag beantwoord? Dan kan je het draadje zelf sluiten .
Wil je Joomla!NL steunen? Dat kan met een donatie.

Laatst bewerkt 18 jun 2018 18:28 door Astrid.
  • Astrid
  • Astrid's Profielfoto
  • Moderator + Technisch team
  • Moderator + Technisch team
  • Berichten: 37114

herschalen afbeelding + correcte grootte

18 jun 2018 17:44
#3
Hahahahaha - dat antwoord had ik niet zien aankopen. Maar het is wel een duidelijk antwoord.

Ik ga niet op zoek gaan naar een goede responsive template, het is een simpele site en een goede look is eigenlijk niet mijn grootste zorg (basic volstaat).
Ik zal het dan allemaal zo laten.

Toch bedankt voor de info !
(is inderdaad joomla 3.3.8).

Mvg
Diederik D'Hert
  • diedhert
  • diedhert's berichtenfoto Heeft onderwerp gestart
  • Regelmatige bezoeker van Joomla!NL
  • Regelmatige bezoeker van Joomla!NL
  • Berichten: 191

herschalen afbeelding + correcte grootte

18 jun 2018 18:26
#4
Als je een link deelt kan ik eens kijken.
  • pjasmits
  • pjasmits's berichtenfoto
  • Bekend met Joomla!NL
  • Bekend met Joomla!NL
  • Berichten: 177

herschalen afbeelding + correcte grootte

18 jun 2018 18:35
#5
Alvast bedankt.

De link is www.toelatingsexamenartsentandarts.be
  • diedhert
  • diedhert's berichtenfoto Heeft onderwerp gestart
  • Regelmatige bezoeker van Joomla!NL
  • Regelmatige bezoeker van Joomla!NL
  • Berichten: 191

herschalen afbeelding + correcte grootte

18 jun 2018 18:56
#6
Met onderstaande code wordt het wat mooier.
Code:
.logoheader { height: 100%; width: 100%; padding-top: 3em; }
  • pjasmits
  • pjasmits's berichtenfoto
  • Bekend met Joomla!NL
  • Bekend met Joomla!NL
  • Berichten: 177

herschalen afbeelding + correcte grootte

18 jun 2018 19:33
#7
Dit moet toch in position.css ? Want haalt weinig uit op mijns ite...

Groeten
D.D.
  • diedhert
  • diedhert's berichtenfoto Heeft onderwerp gestart
  • Regelmatige bezoeker van Joomla!NL
  • Regelmatige bezoeker van Joomla!NL
  • Berichten: 191

herschalen afbeelding + correcte grootte

19 jun 2018 05:56
#8
Als je beez3 gebruikt kun je het beste een nieuwe user.css file maken en deze in de css map zetten. Plaats daar de code en het zou moeten werken. Deze file wordt bij een update ook niet overschreven. Standaard wordt de user.css geladen als hij aanwezig is, zoals te zien in de index-file van de template.
  • pjasmits
  • pjasmits's berichtenfoto
  • Bekend met Joomla!NL
  • Bekend met Joomla!NL
  • Berichten: 177

herschalen afbeelding + correcte grootte

19 jun 2018 07:39
#9
In de link die ik je eerder gaf staat de oplossing. En Beez maakt, in tegenstelling tot Protostar, geen gebruik van een user.css
Groetjes, Astrid
Gebruik de zoekfunctie van dit forum voordat je een nieuwe vraag plaatst.
Vragen uitsluitend via dit forum.
yndi.nl - kvk 17157725
Is je vraag beantwoord? Dan kan je het draadje zelf sluiten .
Wil je Joomla!NL steunen? Dat kan met een donatie.

  • Astrid
  • Astrid's Profielfoto
  • Moderator + Technisch team
  • Moderator + Technisch team
  • Berichten: 37114

herschalen afbeelding + correcte grootte

19 jun 2018 17:32 - 19 jun 2018 17:34
#10
Dan heb ik een beez3, die anders is als alle anderen?
Code:
<?php /** * @package Joomla.Site * @subpackage Templates.beez3 <---------- TEMPLATE * * @copyright Copyright (C) 2005 - 2018 Open Source Matters, Inc. All rights reserved. * @license GNU General Public License version 2 or later; see LICENSE.txt */ // No direct access. defined('_JEXEC') or die; /** @var JDocumentHtml $this */ JLoader::import('joomla.filesystem.file'); // Check modules $showRightColumn = ($this->countModules('position-3') or $this->countModules('position-6') or $this->countModules('position-8')); $showbottom = ($this->countModules('position-9') or $this->countModules('position-10') or $this->countModules('position-11')); $showleft = ($this->countModules('position-4') or $this->countModules('position-7') or $this->countModules('position-5')); if ($showRightColumn === false && $showleft === false) { $showno = 0; } JHtml::_('behavior.framework', true); // Get params $color = $this->params->get('templatecolor'); $logo = $this->params->get('logo'); $navposition = $this->params->get('navposition'); $headerImage = $this->params->get('headerImage'); $config = JFactory::getConfig(); $bootstrap = explode(',', $this->params->get('bootstrap')); $option = JFactory::getApplication()->input->getCmd('option', ''); // Output as HTML5 $this->setHtml5(true); if (in_array($option, $bootstrap)) { // Load optional rtl Bootstrap css and Bootstrap bugfixes JHtml::_('bootstrap.loadCss', true, $this->direction); } // Add stylesheets JHtml::_('stylesheet', 'templates/system/css/system.css', array('version' => 'auto')); JHtml::_('stylesheet', 'position.css', array('version' => 'auto', 'relative' => true)); JHtml::_('stylesheet', 'layout.css', array('version' => 'auto', 'relative' => true)); JHtml::_('stylesheet', 'print.css', array('version' => 'auto', 'relative' => true), array('media' => 'print')); JHtml::_('stylesheet', 'general.css', array('version' => 'auto', 'relative' => true)); JHtml::_('stylesheet', htmlspecialchars($color, ENT_COMPAT, 'UTF-8') . '.css', array('version' => 'auto', 'relative' => true)); if ($this->direction === 'rtl') { JHtml::_('stylesheet', 'template_rtl.css', array('version' => 'auto', 'relative' => true)); JHtml::_('stylesheet', htmlspecialchars($color, ENT_COMPAT, 'UTF-8') . '_rtl.css', array('version' => 'auto', 'relative' => true)); } if ($color === 'image') { $this->addStyleDeclaration(" .logoheader { background: url('" . $this->baseurl . "/" . htmlspecialchars($headerImage) . "') no-repeat right; } body { background: " . $this->params->get('backgroundcolor') . "; }"); } JHtml::_('stylesheet', 'ie7only.css', array('version' => 'auto', 'relative' => true, 'conditional' => 'IE 7')); // Check for a custom CSS file JHtml::_('stylesheet', 'user.css', array('version' => 'auto', 'relative' => true)); <------------- user.css JHtml::_('bootstrap.framework'); // Add template scripts JHtml::_('script', 'templates/' . $this->template . '/javascript/md_stylechanger.js', array('version' => 'auto')); JHtml::_('script', 'templates/' . $this->template . '/javascript/hide.js', array('version' => 'auto')); JHtml::_('script', 'templates/' . $this->template . '/javascript/respond.src.js', array('version' => 'auto')); JHtml::_('script', 'templates/' . $this->template . '/javascript/template.js', array('version' => 'auto')); // Check for a custom js file JHtml::_('script', 'templates/' . $this->template . '/javascript/user.js', array('version' => 'auto')); require __DIR__ . '/jsstrings.php'; // Add html5 shiv JHtml::_('script', 'jui/html5.js', array('version' => 'auto', 'relative' => true, 'conditional' => 'lt IE 9')); ?> <!DOCTYPE html> <html lang="<?php echo $this->language; ?>" dir="<?php echo $this->direction; ?>"> <head> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=3.0, user-scalable=yes"/> <meta name="HandheldFriendly" content="true" /> <meta name="apple-mobile-web-app-capable" content="YES" /> <jdoc:include type="head" /> </head> <body id="shadow"> <div id="all"> <div id="back"> <header id="header"> <div class="logoheader"> <h1 id="logo"> <?php if ($logo) : ?> <img src="<?php echo $this->baseurl; ?>/<?php echo htmlspecialchars($logo); ?>" alt="<?php echo htmlspecialchars($this->params->get('sitetitle')); ?>" /> <?php endif;?> <?php if (!$logo AND $this->params->get('sitetitle')) : ?> <?php echo htmlspecialchars($this->params->get('sitetitle')); ?> <?php elseif (!$logo AND $config->get('sitename')) : ?> <?php echo htmlspecialchars($config->get('sitename')); ?> <?php endif; ?> <span class="header1"> <?php echo htmlspecialchars($this->params->get('sitedescription')); ?> </span></h1> </div><!-- end logoheader --> <ul class="skiplinks"> <li><a href="#main" class="u2"><?php echo JText::_('TPL_BEEZ3_SKIP_TO_CONTENT'); ?></a></li> <li><a href="#nav" class="u2"><?php echo JText::_('TPL_BEEZ3_JUMP_TO_NAV'); ?></a></li> <?php if ($showRightColumn) : ?> <li><a href="#right" class="u2"><?php echo JText::_('TPL_BEEZ3_JUMP_TO_INFO'); ?></a></li> <?php endif; ?> </ul> <h2 class="unseen"><?php echo JText::_('TPL_BEEZ3_NAV_VIEW_SEARCH'); ?></h2> <h3 class="unseen"><?php echo JText::_('TPL_BEEZ3_NAVIGATION'); ?></h3> <jdoc:include type="modules" name="position-1" /> <div id="line"> <div id="fontsize"></div> <h3 class="unseen"><?php echo JText::_('TPL_BEEZ3_SEARCH'); ?></h3> <jdoc:include type="modules" name="position-0" /> </div> <!-- end line --> </header><!-- end header --> <div id="<?php echo $showRightColumn ? 'contentarea2' : 'contentarea'; ?>"> <div id="breadcrumbs"> <jdoc:include type="modules" name="position-2" /> </div> <?php if ($navposition === 'left' and $showleft) : ?> <nav class="left1 <?php if ($showRightColumn == null) { echo 'leftbigger';} ?>" id="nav"> <jdoc:include type="modules" name="position-7" style="beezDivision" headerLevel="3" /> <jdoc:include type="modules" name="position-4" style="beezHide" headerLevel="3" state="0 " /> <jdoc:include type="modules" name="position-5" style="beezTabs" headerLevel="2" id="3" /> </nav><!-- end navi --> <?php endif; ?> <div id="<?php echo $showRightColumn ? 'wrapper' : 'wrapper2'; ?>" <?php if (isset($showno)){echo 'class="shownocolumns"';}?>> <div id="main"> <?php if ($this->countModules('position-12')) : ?> <div id="top"> <jdoc:include type="modules" name="position-12" /> </div> <?php endif; ?> <jdoc:include type="message" /> <jdoc:include type="component" /> </div><!-- end main --> </div><!-- end wrapper --> <?php if ($showRightColumn) : ?> <div id="close"> <a href="#" onclick="auf('right')"> <span id="bild"> <?php echo JText::_('TPL_BEEZ3_TEXTRIGHTCLOSE'); ?> </span> </a> </div> <aside id="right"> <h2 class="unseen"><?php echo JText::_('TPL_BEEZ3_ADDITIONAL_INFORMATION'); ?></h2> <jdoc:include type="modules" name="position-6" style="beezDivision" headerLevel="3" /> <jdoc:include type="modules" name="position-8" style="beezDivision" headerLevel="3" /> <jdoc:include type="modules" name="position-3" style="beezDivision" headerLevel="3" /> </aside><!-- end right --> <?php endif; ?> <?php if ($navposition === 'center' and $showleft) : ?> <nav class="left <?php if ($showRightColumn == null) { echo 'leftbigger'; } ?>" id="nav" > <jdoc:include type="modules" name="position-7" style="beezDivision" headerLevel="3" /> <jdoc:include type="modules" name="position-4" style="beezHide" headerLevel="3" state="0 " /> <jdoc:include type="modules" name="position-5" style="beezTabs" headerLevel="2" id="3" /> </nav><!-- end navi --> <?php endif; ?> <div class="wrap"></div> </div> <!-- end contentarea --> </div><!-- back --> </div><!-- all --> <div id="footer-outer"> <?php if ($showbottom) : ?> <div id="footer-inner" > <div id="bottom"> <div class="box box1"> <jdoc:include type="modules" name="position-9" style="beezDivision" headerlevel="3" /></div> <div class="box box2"> <jdoc:include type="modules" name="position-10" style="beezDivision" headerlevel="3" /></div> <div class="box box3"> <jdoc:include type="modules" name="position-11" style="beezDivision" headerlevel="3" /></div> </div> </div> <?php endif; ?> <div id="footer-sub"> <footer id="footer"> <jdoc:include type="modules" name="position-14" /> </footer><!-- end footer --> </div> </div> <jdoc:include type="modules" name="debug" /> </body> </html>
Laatst bewerkt 19 jun 2018 17:34 door pjasmits.
  • pjasmits
  • pjasmits's berichtenfoto
  • Bekend met Joomla!NL
  • Bekend met Joomla!NL
  • Berichten: 177

herschalen afbeelding + correcte grootte

19 jun 2018 18:05
#11
Je hebt gelijk Patrick. Totaal overheen gekeken.
Groetjes, Astrid
Gebruik de zoekfunctie van dit forum voordat je een nieuwe vraag plaatst.
Vragen uitsluitend via dit forum.
yndi.nl - kvk 17157725
Is je vraag beantwoord? Dan kan je het draadje zelf sluiten .
Wil je Joomla!NL steunen? Dat kan met een donatie.

  • Astrid
  • Astrid's Profielfoto
  • Moderator + Technisch team
  • Moderator + Technisch team
  • Berichten: 37114
Moderators: PeterJuliank92JelleRomke
Tijd voor maken pagina: 0.923 seconden

Wil je Joomla!NL steunen?

Steun Joomla!NLAlle teamleden werken enthousiast, op vrijwillige basis, mee aan Joomla!NL. Maar een website met forum kost nu eenmaal geld. Dus als je Joomla!NL wilt steunen, dan kan dat, graag zelfs!

Lees hier meer informatie