I don't have any expertise in programming, just from the little I've researched to solve one-off needs. However, the one thing I can't seem to find answers for is populating dynamic content on a page.
I currently build my website with no code programs (Airtable as my back-end).
For my work, my clients each receive a link to a webpage that contains a few client-specific variables (name, birthdate, pdf link) - is it possible to pass these parameters through the URL to have them show on the webpage?
I assumed it would function similarly to passing form data to a thank you page URL, is this theory correct? And if so, can anyone help with what I need to do/what html & js codes I need to implement to make this happen?
Thanks in advance (this would make my life a million times easier)!
Yes you can easily parse URL parameters with JS, see simple example bellow:
https://exampleurl.com/?birthdate=22091977&pdflink=yourlink123.pdf
<html>
<body>
<span id="birthdate"></span>
</body>
</html>
<script>
const queryString = window.location.search;
const urlParams = new URLSearchParams(queryString);
const birthdate = urlParams.get('birthdate');
const pdflink = urlParams.get('pdflink');
document.getElementById("birthdate").innerHTML = birthdate;
</script>
you can completely pass parameters via URL. eg: your_domain.com/name1/birth-date/code-pdf
Related
I am currently working on a Google Tag Manager regex formula but what it needs to do is just show a specific word/s from a page path or page url.
For example:
/page/course/tag-manager-lesson1/?
/page/course/tag-manager-topic1/?
1st Output is "tag-manager" then
2nd Output is either "lesson1" or "topic1"
I found this question closely similar but somehow a little different on what is being extracted.
Thanks for the help!
JavaScript Variable
function(){
var allMatches = Array.from("/page/course/tag-manager-
lesson1/?".matchAll(/.*(tag-manager)-(\w+)\//g))
var result = [allMatches[0][1], allMatches[0][2]]
return result;
}
This should work. Or you have other more complicated page path than this.
Using a redirect URL from Cognito Forms, I'm able to embed a parameter in the URL. Works great, I'm a big Cognito Forms fan! The URL looks like this: http://mywebsite.com/results?Score=x where x is equal to any whole number from 0 to 100. So when the page loads as a result of the redirect URL it might be http://mywebsite.com/results?Score=48
I simply want to display the score on my page, in this case x = 48. I'm using a GoDaddy Website builder which allows me to insert a custom HTML code section on a page, but I haven't been able to figure out the right code to make the actual Score display. I simply want to show on the page ... Score = 48 ... or whatever value is is embedded in the URL.
Seems like it shouldn't be hard, but I haven't been able to accomplish it. GoDaddy isn't able to offer any help related to HTML code. Any assistance would be appreciated.
you need javascript
const queryString = window.location.search;
const urlParams = new URLSearchParams(queryString);
const score= urlParams.get('Score')
console.log(score);
var para = document.createElement("p");
var node = document.createTextNode(score);
para.appendChild(node);
var element = document.getElementById("div1");
element.appendChild(para);
Something like this will show the score after a div with the id 'div1'
There is a main Sales Page: site.com/sales-page
That page receives visitors from different traffic sources, and they are mentioned on its URL parameters, such as: site.com/sales-page?utm_source=fbads&utm_campaign=banner
That Sales Page has a link pointing to BUY NOW
How do I pass all URL parameters from the current window, such as "?utm_source=fbads&utm_campaign=banner" automatically to the next page via the BUY NOW button?
I need this so the Checkout page will know where the traffic came from, based on that forwarded parameter.
PS: I want to pass all parameters available in the URL, not just pre-defined ones.
PPS: Solution must work on most browsers and on static pages, better to not use cookies/php.
Thanks a lot.
There is no way to achieve this using HTML. You have to use a programming language.
For example:
<?php
$url = "http://example.com/foo/?" . $_SERVER['QUERY_STRING'];
?>
link
If you don't want to use PHP, then other programming languages are available.
There is no way to do it with just html. Best solution is serverside code. Fallback is to use JavaScript, but this will not work if JavaScript is disabled. You can read the search from the url and add it to your link.
<a id="buyNow" href="http://www.example.com">Buy</a>
<script>
(function () {
var lnk = document.getElementById("buyNow");
lnk.href = lnk.href + window.location.search;
}())
</script>
This assumes there is no querystring already on the link. If there is, you need to replace the ? in the search with a &
I have several pages that are arrived on with valid GET data, such as http://website.com/?id=12345
I have a generic HTML form that is pulled onto many different pages using php's "require" and submits using POST. Regardless of which page this form is located on, it should always submit back to that same page. However, after the form is submitted, I would like the ?id=12345 to be stripped out.
So, for example, if the user is on http://website.com/new.php?id=12345, it should post back to http://website.com/new.php. If the user is on http://website.com/old.php?id=12345, that same form it should post back to old.php
Previously the best solution I found was to style the form as such:
<form action="?" method="POST">
Which will change all links to http://website.com/new.php? or http://website.com/old.php? which is very close, but not perfect.
As it turns out, I finally found the solution to my problem by using JavaScript:
url = location.href;
qindex = url.indexOf("?");
This can pull whatever is on the address bar as a string and find the index of the first ? mark. From there:
if(qindex != -1)
tells me that there is a ? mark
var plainUrl = url.substring(0, qindex);
Can get, as a string, everything up to the ? mark, but not after. Finally:
window.location.replace(plainUrl);
Will rewrite the address bar to the plain URL, not including the ? or whatever comes after, and without redirecting the browser.
Since your page will not undergo any server-side processing, you can achieve what you want via a combination of the following two tricks.
First, change your particular querystring to a hash, which is thereafter directly editable without triggering a page reload:
http://yourdomain.com/page.html#search=value
Then modify such a script as this to do what you want to do, according to the query string passed in.
<script type='text/javascript'>
// grab the raw "querystring"
var query = document.location.hash.substring(1);
// immediately change the hash
document.location.hash = '';
// parse it in some reasonable manner ...
var params = {};
var parts = query.split(/&/);
for (var i in parts) {
var t = part[i].split(/=/);
params[decodeURIComponent(t[0])] = decodeURIComponent(t[1]);
}
// and do whatever you need to with the parsed params
doSearch(params.search);
</script>
now you can delete the query string suffix in the following way:
As detailed elsewhere, namely hide variables passed in URL, it's possible to use JavaScript's History API in modern browsers.
history.replaceState({}, null, "/index.html");
That will cause your URL to appear as /index.html without reloading the page
This little gem is explained in more detail here:
https://developer.mozilla.org/en-US/docs/Web/API/History_API
I'm using play framework in this project and I'm trying to send an E-mail with a Logo attached but I want to show this logo as part of my HTML code!
My Mailer:
EmailAttachment attachment = new EmailAttachment();
attachment.setDescription("Logo");
attachment.setName("logoMail.jpg");
attachment.setPath(Play.getFile("/public/images/email/logoMail.jpg").getPath());
addAttachment(attachment);
My HTML
The e-mail is sent, my Logo is attached there, but the image is never showed as a background on my DIV.
What am I doing wrong?
Thank you very much!
It depends on the e-mail client you are using to read your test e-mail. Most of them ignore or remove the background-image css property.
Take a look at the following:
http://www.email-standards.org/
http://www.campaignmonitor.com/design-guidelines/
I've been looking into embedding images into emails using MVC templates, and I think at the moment it's not supported.
As far as I can see, in order to use embedded images, the image attachment needs to have a Content-ID header on it. Attaching the image using addAttachment generates an attachment without this header.
The underlying email framework, apache commons email, allows you to embed images using the HtmlEmail.embed method, and there is an example of this in the Play documentation, but only when using Commons Email directly. addAttachment() will add an ordinary attachment, not an embedded one.
The problem is that HtmlEmail.embed returns the content id for the embedded image. The first problem is that there would need to be a mechanism for passing that content id forward into the template, so that you could reference it in the relevant link.
The second problem is that the way the Mailer.send() method is coded, the email itself is not created until after the template is rendered, and the result of attempting to render an html body is used to decide whether to create an HtmlEmail or a SimpleEmail. This method would need to be re-written to decide the type of email before rendering the template, and, if it was html, to create the HtmlEmail and attach the embedded images prior to rendering the template, so that it could pass the content ids to the renderer.
It certainly isn't impossible to make this change, and I might attempt it if I can find the time on my current project.
The solution could be to render HTML content manually and then put it into email. This code worked for me:
public static String test() throws EmailException, MalformedURLException {
HtmlEmail email = new HtmlEmail();
email.setHostName("smtp.server.com");
email.setAuthentication("username", "pwd");
email.setSubject("subject");
email.addTo("to#example.com");
email.setFrom("from#example.com");
URL url = new URL("https://example.com/image.png");
String cid = email.embed(url, "IMG1");
Template templateHtml = TemplateLoader.load("/Mails/test.html");
final Map<String, Object> templateHtmlBinding = new HashMap<String, Object>();
templateHtmlBinding.put("cid", cid);
String body = templateHtml.render(templateHtmlBinding);
email.setHtmlMsg(body);
return email.send();
}
I'm a bit late with my answer, but it is possible and integrates nicely with the MVC-Email tutorial. Assuming your mailer class is also notifiers.Mails, use this as a html template:
%{
String logoSrc = notifiers.Mails.getEmbedddedSrc("public/images/logo.png", "cool logo");
}%
<html>
<head>
</head>
<body>
Look at this cool image! <br>
<img src="${logoSrc}">
<br>
Amazing, no?
</body>
</html>