And now, you want customers enter the portal through your web-site. To resolve this issue, we can use “iframe”-tag in HTML-code of web-site. Just select some container and paste there “iframe”:
Is there any way to change the layout of the iframe page? I would like to change the Customer Login text and replace the button with our custom buttons to match our website.
If you’re trying to embed the Splynx login in your own website (for branding, seamless customer UX, etc.), here’s what you need to know:
1. Twig/Template Customizations Are Dead
If you’ve used Splynx for a while, you might remember being able to override portal Twig templates directly (e.g. login.twig). That’s no longer possible in recent Splynx versions!
The login page is now locked down; direct Twig or template overrides won’t work. (I spent hours on this—don’t bother.)
2. The Only Real Solution: Use the Add-On Module System
I opened a support ticket, and Splynx support confirmed:
“The best option for changing the customer portal is through the add-on entry points. You can create a new add-on on your Splynx instance and set the appropriate entry points with the corresponding style customization.”
Insert your <style>...</style> or <script>...</script> in the code box
Example: Hide parts of the default login, override styles, etc.
Click Install
3. Embedding in Your Website: Use an iFrame
Since direct template overrides are impossible, the only way to embed the login in your external website is via an <iframe> pointing to the login page.
The catch? The default Splynx portal layout is NOT made for embedding—so you must:
Use your module add-on to hide everything except the form
Override padding, backgrounds, etc. with CSS injected from the module
Twig overrides are dead. Use the add-on entry point system to inject custom CSS/JS, hide everything but the form, and use an iFrame to embed in your site.
We were worried about people who had booked marked the portal login page after moving the login to our website, so we wanted the login visible inside our embedded iFrame (using the ?iframe query string). After some trial and error and support guidance, here’s the simple solution:
Add this script to your custom module or header:
<script>
// Redirect users who do NOT have ?iframe in the URL
(function() {
if (window.location.search.indexOf('iframe') === -1) {
window.location.href = 'https://www.myisp.com/login'; // Change this to your desired landing page
}
})();
</script>
What it does:
If the page is loaded without ?iframe, the user is immediately redirected to your chosen landing page.
If loaded with ?iframe, (i.e., inside your website’s embed) nothing happens—the login works as expected.
This keeps your customer portal login clean and only visible where you want it.
Why did you need the Add-on system instead of just using the “Site customization” stuff?
(splynxurl/admin/config/main/customization)
There’s a “Customer portal” section where you can give it custom CSS and custom JavaScript to override things… Although I suppose if your customizations are complicated enough then maybe the add-on is required?
The “site customization” applies to the entire portal and not just the login page. By creating a custom module we were able to modify the code on just the login page itself and not the entire customer portal.
Hiding everything but the login fields and button on the customer portal wouldn’t work so well lol.
P.S. regarding the twig - it’s not dead yet, but developers are planning to remove it completely as they step-by-step replace it with Vue.js
So, it’s better to avoid of using it.
So what does that mean for invoice templates? If we build them on twig, are they going to have to be recoded as well? Or is twig just being depreciated for pages.
We are also trying to add the iframe to our website but we don’t want to disable “Trust all domains” in order to start adding them manually. We use a few API sources such as One Touch Switching etc. So custom module is looking like our solution, just need to understand the process.
so to confirm, The trus all domains must be disabled and manually declared per URL, then the install-module process and where the point config code requires adding, the div and it’s embedded ifram code added, then module installed and ifram code also added to website?
Or is it simply a case of disable all domains, add those using API, then add the iframe to the website HTML with no “install-module” required?
