fbpx

Trick or Treat - 30% OFF - Coupon Code: SCARY20 Grab the Deal!

Welcome, Guest
Username: Password: Remember me

TOPIC: (SOLVED)login module opening in popup window (lightbox) have no css?

login module opening in popup window (lightbox) have no css? 4 months 3 weeks ago #22838

  • Chacapamac
  • Chacapamac's Avatar
  • Offline
  • Elite Member
  • Posts: 166
  • Thank you received: 4
  • Karma: 0
On all my websites I have a login module opening in a lightbox ( I use mostly JCE Mediabox, Rockettheme Rokbox) and never have a problem.
On Astroid with the same technique, the login module appear without any css from the template.




Test site —> www.graf-test.ca/astroid/index.php/fr/

I use the call
<div class="logindiv"><a class="jcepopup noicon" href="/your-account/login?tmpl=component" data-mediabox="1" data-mediabox-width="400" data-mediabox-height="550"><span class="awesome"><i class="fas fa-user fa-fw fa-login"></i></span></a><span class="login-pipe">|</span></div>

This is the answer of Ryan, owner of JCE.
Local content is loaded in a popup by adding ?tmpl=component to the url, which allows only the article content to be loaded in the popup, instead of the whole site.

In many templates however, the component.php file from the template which is then loaded, instead of the usual index.php file, does not load all the template's css files.

Do you have a trick to bring back the CSS ?

LIttle worry about that as I use lightbox to present Joomla articles, others modules and contents....
Last Edit: 4 months 2 weeks ago by Chacapamac.
The topic has been locked.

login module opening in popup window (lightbox) have no css? 4 months 3 weeks ago #22839

  • Chacapamac
  • Chacapamac's Avatar
  • Offline
  • Elite Member
  • Posts: 166
  • Thank you received: 4
  • Karma: 0
HEEEEEELP! - Ok, this is becoming a MAJOR problem now!
I’m trying, but so far not successful to add the template css back in.

As I say, I use frequently content in lightbox for Joomla articles, modules and other contents, THIS IS PART OF ALL THE WEBSITES I DEVELOP.

I use templates for many providers like, JSN Sun, Rockettheme, and others and I never have that problem.

I have to stop all production on a website until I find a solution or change template provider altogether.
Last Edit: 4 months 3 weeks ago by Chacapamac.
The topic has been locked.

login module opening in popup window (lightbox) have no css? 4 months 3 weeks ago #22840

  • Chacapamac
  • Chacapamac's Avatar
  • Offline
  • Elite Member
  • Posts: 166
  • Thank you received: 4
  • Karma: 0
If I understand correctly....

I think this happen because your component.php file (astroid_template_zero > component.php) is not loading the actual template css

Coming back soon!
Last Edit: 4 months 3 weeks ago by Chacapamac.
The topic has been locked.

login module opening in popup window (lightbox) have no css? 4 months 3 weeks ago #22841

  • Chacapamac
  • Chacapamac's Avatar
  • Offline
  • Elite Member
  • Posts: 166
  • Thank you received: 4
  • Karma: 0
I was able to bring my generated css file (by custom.scss) in astroid zero css by hacking your component.php
<!DOCTYPE html>
<html lang="<?php echo $this->language; ?>" dir="<?php echo $this->direction; ?>">
   <head>
   <jdoc:include type="head" />
   [b]<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template; ?>/css/custom-06990a99f87dea2049782d30f991833f.css" type="text/css" />[/b]
</head>
<body class="contentpane component">
<jdoc:include type="message" />
<jdoc:include type="component" />
</body>
</html>

And my login form now have some css (on my local test site (not change on the live test)

Now what I need to do?— Tel me how!
• Create an overrde of your component.php file
• Add the general css (your css) from your template
• Also Add my generated custom-1234whatever-generated-numbers-here.css (from ny custom.scss)

I guess for the generated name, I will have to use some JavaScript in the call?

================================================
what I try so far:
• Create an overrde of your component.php file
Your “frontend” folder method cannot create override of your component.php, not working.....
Last Edit: 4 months 3 weeks ago by Chacapamac.
The topic has been locked.

login module opening in popup window (lightbox) have no css? 4 months 3 weeks ago #22874

  • Chacapamac
  • Chacapamac's Avatar
  • Offline
  • Elite Member
  • Posts: 166
  • Thank you received: 4
  • Karma: 0
So far what I know!
component.php is the template for showing the component without any modules or headings.
— add &tmpl=component to the url. That what the print and pdf icons do and also when using a lightbox to show content.

• You cannot create an override of the component.php in the templates > astroid_template_zero > component.php folder.
— The fact that is it there is already an override of the Joomla onboard component.php in the templates > system > component.php

• Your component.php override contain this stylesheet
// Styles
JHtml::_('stylesheet', 'general.css', array('version' => 'auto', 'relative' => true));
That correspond to nothing????

So far I find 2 way to bring my custom-xyz012345.css to the component template file by adding to your component.php;
• directly before the closing </head> code the <link rel="stylesheet" href=..... call to my custom.css file (already show before)
or by adding it with JHtml before the <!DOCTYPE html>
// Styles
JHtml::_('stylesheet', 'general.css', array('version' => 'auto', 'relative' => true));

// My custom.css Stylesheet
JHtml::_('stylesheet', 'custom-06990a99f87dea2049782d30f991833f.css', array('version' => 'auto', 'relative' => true));

?>
<!DOCTYPE html>

Now, I’m looking for a way to add some regular expression or regex to catch the file even if the part of the name of the css file generated changes.

As i was saying, this is the first template ever that I work with that I have to mess wit that to have Somme css in the component template.

Suggestion:

• You should have, at least the most importants template styles active in your component.php override.

— In it, your actual reference to
JHtml::_('stylesheet', 'general.css', array('version' => 'auto', 'relative' => true));
is useless, I think, as no general.css exist?
The topic has been locked.

login module opening in popup window (lightbox) have no css? 4 months 2 weeks ago #22943

  • Chacapamac
  • Chacapamac's Avatar
  • Offline
  • Elite Member
  • Posts: 166
  • Thank you received: 4
  • Karma: 0
There is the solution:

Add the generated css (in css folder) to Astroid component.php override.

Note: In a template, when you have a component.php file at the first level, it’s an override of Joomla component.php in root > templates > system > component.php
— It is not possible to create an override of the component.php if present in the active template as it is already an override
— Please keep the original file and the modified one as it can be overwritten by futur update of the template



Method from Joomla Forum: forum.joomla.org/viewtopic.php?f=727&t=9...7&p=3606733#p3606733

If you have multiple files, adjust the regex accordingly ( custom|style|astroid)-.+\.css)
— Here all css files with a name starting with —> custom- or style- or astroid- follow by whatever alphanumeric sequence and finishing by .css will be added to the component when use.
Example: astroid-a9a5eb77d4af3bda7cedcdd19540c029.css — in the astroid zero Template css folder will be use
— Doesn’t matter if the generated alphanumeric portion of the file change it will always be used.


• Add at the top of component.php
Just under “or die”
use Joomla\CMS\Filesystem\Folder;
use Joomla\CMS\HTML\HTMLHelper;


• Add at the bottom of component.php
Just before
?>
<!DOCTYPE html>

$files = Folder::files(JPATH_THEMES . '/' . $this->template . '/css', '(custom|style|astroid)-.+\.css');
foreach ($files as $file)
{
	HTMLHelper::_('stylesheet', $file, ['version' => 'auto', 'relative' => true]);
}


[SOLVED]
The topic has been locked.
Moderators: chandandeep
Time to create page: 1.163 seconds