Stefanowitsch
-
Posts
228 -
Joined
-
Last visited
-
Days Won
4
Stefanowitsch's Achievements
Sr. Member (5/6)
172
Reputation
-
module PrivacyWire - Cookie Management & async external asset loading
Stefanowitsch replied to joshua's topic in Modules/Plugins
@joshua Great! Thank you very much for the fast and simple solution. -
Yes I have to observe it some new bugs will appear. I don't even know why fastclick solves this issue, maybe it would be enough to find out that little piece of code inside this library that does the trick and just extract hat.
-
If anyone is looking for a workaround: Using JS fastclick solves this issue for me. This seems to be an iOS related problem. If you google for "iOS double tap link issue" you'll find plenty of threads. Mostly they have to do with CSS hover pseudo elements but this was not the case here.
-
module PrivacyWire - Cookie Management & async external asset loading
Stefanowitsch replied to joshua's topic in Modules/Plugins
It would be a very useful feature. Setting up PrivacyWire from ground up is a bit of work and not all my sites need it. It would be easier to be able to switch it on/off depending on the clients needs. -
module PrivacyWire - Cookie Management & async external asset loading
Stefanowitsch replied to joshua's topic in Modules/Plugins
Is there a simple way to turn the cookie banner active/inactive in the module settings? I would like to prepare a default banner for my projects that is not shown by default. -
@bernhard I made a little tweak to the rf-scrollclass script. Okay it was not me directly. Instead I asked a certain AI if it is possible to alter the script... just for scientific purposes of course ๐ I want to add multiple rf-scrollclass attributes to one DOM element: <header class="rf-scrollclass" rf-scrollclass="scrolled@20 scrolledmobile@15"> Now the class "scrolledmobile" gets added at 15px, the "scrolled" class gets added at 20px - all on the same element. This gives me the ability to use css media queries for some responsive tweaking of the position of my fixed navbar (for example!) header { position: absolute; top: 40px; width: 100%; z-index: 100; @media @min-m { &.scrolled { top: 20px; position: fixed; } } @media @max-s { top: 30px; &.scrolledmobile { top: 15px; position: fixed; } } } Long story short, here's the updated script: (function () { let scrollElements = document.querySelectorAll("[rf-scrollclass]"); for (i = 0; i < scrollElements.length; i++) { let el = scrollElements[i]; let attrs = el.getAttribute("rf-scrollclass").split(" "); for (j = 0; j < attrs.length; j++) { let parts = attrs[j].split("@"); if (parts.length != 2) return; let cls = parts[0]; let y = parts[1] * 1; window.addEventListener("scroll", function () { scrollpos = window.scrollY; if (scrollpos >= y) el.classList.add(cls); else el.classList.remove(cls); }); } } })();
-
Awesome! It is working now.
-
I included the script in my head like this: <? $rockfrontend->scripts() ->add($config->urls->templates . 'scripts/uikit/uikit.min.js') ->add($config->urls->templates . 'scripts/uikit/uikit-icons.min.js') ->add("/site/modules/RockFrontend/scripts/rf-scrollclass.js", "defer") ->minify(!$config->debug); ?> When minify is set to "true" this is rendered in the <head> section ("defer" missing):
-
@bernhard can you take a look? When using the minify function of RockFrontend the "defer" attribute gets lost. So the script will never fire. A workaround for me was to wrap the script into a JS "DOMContentLoaded" Function.
-
My interest in in RockFrontend was initiated as the module was launched last year: At first only because of the auto-refresh feature. Being tired of hitting F5 all the time that feature alone (!) made development far more enjoyable for me. Even back then RF offered many many features, most of them I still don't use today (shame on me!). Plus - @bernhard is constantly adding new features to this module and I have to say that it's hard to keep track sometimes. For example I just learned "by accident" about the new rf-scrollclass feature ๐ So simultaneously you have to keep 3 different places up-to-date when new changes arrive: - Github - The PW module page entry - The module thread in the PW forum oh and also Youtube ๐ Therefore I can agree - I find myself from time to time looking for "that one thing that I read" and I don't find it anymore. In that case I ask Bernhard personally via PM like "how do I do this and that?". If it's something that is not supported by RF yet but would be useful it is not unlike that Bernhard will include it in a new version. I think people have to see RockFrontend as a big toolbox. You don't need everything in it. You only grab the tools you need for your current task.
-
Can someone explain to me what this means? In case of best-practice. Usually for the sender address I use something like noreply@mydomain.com but this address does not send the mail actually. In fact I have a separate address like mailer@mydomain.com (as SMTP user in the module settings) which sends out the mails from the forms on a website. As far as I understand those addresses have to match in some cases?
-
I want to show you a project that I started developing in summer of 2022 and that went online in january 2023. Kulturhaus Wilster ("Arts Centre Wilster") https://www.kulturhauswilster.de The Kulturhaus Wilster - also called "Wilster's living room" by many visitors - is a socio-cultural center in the heart of Wilster. Wilster is a small City located north from Hamburg, germany. Despite the fact that this is a small venue they offer large amount of events. The events range all the way from concerts to theatre and everything inbetween! The old version of the site was a super simple WordPress website in a black-and-white only color scheme. In my opinion it did no justice to the very colorful program that the Kulturhaus offers so I tried my best to bring some color into the game. The whole website should have a shabby-chique look combined with clean, modern elements. The Homepage offers a preview of the next 8 upcoming events. A blog section is also included and the latest post is displayed next to the event calendar book as PDF download. The event pages offer a quick-reservation form (tickets are not sold online) and a quick look to the next upcoming events in the sidebar. The website features a large event calendar. It was a really nice exercise in using ProcessWires very own paging and selector features. Events can be searched and filtered by type (and month), too. All with a few lines of code only. For example "Look for events that take place in the future in a specific category" $events = $pages->find("select_event_cat.title~|%=$c, template=event, date_event>=today, sort=date_event, sort=time_from, limit=6"); Besides that the website features some colorful content pages with large images, galleries, textboxes and some teaser elements. The editors of the website are able to display all facets of the Kulturhaus this way. Tech Talk: Frontend Framework is Bootstrap 4.6 ProcessWire Modules used on this one are: - WireMail: SMTP (https://processwire.com/modules/wire-mail-smtp/) - SEO Maestro (https://processwire.com/modules/seo-maestro/) - All in one minify for asses (https://processwire.com/modules/all-in-one-minify/) - PageImageSource for webp image srcsets (https://processwire.com/modules/pageimage-source/) - JkPublishPages is used for time-controlled publishing of the blog posts. Please check out this module! Thanks @Juergen - @bernhards great RockFrontend was also used. In this particular project only the autorefresh feature (because this module was brandnew back then and development of the page was almost done). But even "only" using autorefresh makes it worth using it! Please have a look:
-
I just used this module in a project where I needed to add a line break into a headline field that does not allow HTML tags. Normally you would just insert a <br> tag. Sometimes you have this case where you need just this one little tweak and don't want to change field settings globally or create a new field/setting just for a single purpose. For example: How do you get a linke break into this headline when HTML is now allowed in the field settings? You could shrink down the parent container in the front end to "force break" the text. But this is kind of unpredictable as you never now if the client changes the text at one point in the future. So here's my solution. I can define line breaks via the @-sign like this: Not without some custom code of course: $wire->addHookAfter("TextformatterRockDown::replace", function ($event) { $str = $event->arguments(0); $str = preg_replace("/@/", "<br>", $str); $event->return = $str; }); This is the result:
-
A big shout-out and thank-you to @bernhard for keeping on improving the RockFronend. (and the whole Rock-EcoSystem) continuously. I asked for a minify-feature and here it is! I am using RockFrontend in every project now as it combines some must-have features for frontend development (IMHO!). Today a new feature was added (or lets say improved as auto-minify was included before) The Minify Feature (for Styles and Scripts!) See the Wiki entry here Lets start simple: How do I include stylesheets with RockFrontend in the first place? RockFrontend always had the feature to bundle stylesheets via the styles() function. For example I am loading some LESS partials into my header like this. You don't have to use LESS files, regular CSS files work the same. Note: Since RockFrontend offers LESS support you can add those files directly, no need to compile them and add the CSS files. For this you have to install the ProcessWire Less module. <? $rockfrontend->styles() ->add($config->urls->templates . 'styles/less/uikit/_custom-import.less') // add single LESS or CSS file ->addAll($config->urls->templates . 'styles/less/project') // point to folder to include files automatically ->addAll($config->urls->templates . 'styles/less/custom') ?> The result in this case is a single compiled CSS file that will be included in your head automatically. RockFrontend is very smart. You don't have to include tons of partial LESS project files here. Just use the addAll() function and point to a folder where your assets are saved and the module does the import for you. This is how my folder structure looks like. If I create new LESS files in there, they will be added and compiled automatically at runtime. How to minify For debugging and development purposes I don't use the minify feature. Instead I use it on the staging server exclusively. To generate a minified version of your stylesheet just add minify(true) <? $rockfrontend->styles() ->add($config->urls->templates . 'styles/less/uikit/_custom-import.less') ->addAll($config->urls->templates . 'styles/less/project') ->addAll($config->urls->templates . 'styles/less/custom') ->minify(true); ?> If you want to chain the minify function it to your debug-mode state you can do it like this (my preferred solution). <? $rockfrontend->styles() ->add($config->urls->templates . 'styles/less/uikit/_custom-import.less') ->addAll($config->urls->templates . 'styles/less/project') ->addAll($config->urls->templates . 'styles/less/custom') ->minify(!$config->debug); ?> That's it! Does minify work with Scrips? Yes, exactly the same. But you make use of the scripts() function in this case. <? $rockfrontend->scripts() ->add($config->urls->templates . 'scripts/script1.js') ->add($config->urls->templates . 'scripts/script2.js') ->add($config->urls->templates . 'scripts/script3.js') ->minify(!$config->debug); ?> Note that these script files are not bundled (even if you chose minify false). Instead they all come out as minified versions separately. I find that this workflow I straight forward and it combines some of the best features that RockFrontend offers! If you combine this with the awesome autorefresh feature, frontend development becomes a breeze!
-
This entry is added to the exceptions log. Maybe it's not a problem of your module at all as it seems but has to to with the latest dev version? I have no idea why this is happening, though. No Template specified (in /wire/modules/Process/ProcessTemplate/ProcessTemplate.module line 760)
