How do I customize an HTML template before sending it in an email using Meteor and Mandrill? - meteor

I'm setting up an HTML template (not meteor template, but just a template written in HTML) and I need to plug in values for each donation received on our donation page. I will then submit that HTML file to Mandrill and it will send the file out to their email address. I don't know how to get started here. I just need a push in the right direction, or a resource to look for.
The question I have is, how do I add values into a static HTML file, then give that file to the Mandrill app without creating a new HTML file each time a receipt is sent and without changing the original file?
Thanks

Look like I just needed to paste in the merge tag fields that I want to use, then reference them when I do my API call.
http://help.mandrill.com/entries/21678522-How-do-I-use-merge-tags-to-add-dynamic-content-
So the template can have text like this, with the mergetag surrounded by *|...|*
Dear *|FNAME|*,
Then in the API call just tell Mandrill what fname should be replaced with.
```
"merge_vars": [
{
"rcpt": "emailadress#domain.com",
"vars": [
{
"name": "fname",
"content": "John"
},
```

Related

Meta tags implementation on MeteorJS

I am maintaining a MeteorJS web app and I need to add some specific meta tags into homepage.
I see that there is a head.html in the project that has all information, including
the existing og meta tags, I tried to add the specific meta tag there and restarted the server.
If I right click view source on the homepage, I can see the newly added meta tag.
However, if I try to use Facebook debugger to see what the FB Crawler sees, the newly added meta tag is not seen by the bot. In fact the bot sees some additional twitter meta tags that does not exist anywhere in the project.
Investigating further, I noticed the project uses a library called
manuelschoebel:ms-seo: https://github.com/DerMambo/ms-seo
This library is initialised in the Meteor.startup like this:
Meteor.startup(function() {
if(Meteor.isServer){
if(Meteor.DEBUG){
robots.addLine('Disallow: /');
}
robots.addLine('Disallow: /admin');
}
if(Meteor.isClient){
// default SEO
return SEO.config({
title: '...',
meta: {
"description": "..."
},
og: {
'image': '....'
}
});
}
Now I am guessing this SEO library is the reason why the bot does not see the newly added meta tag in the head.html.
What is the right way to add the newly meta tag in a clean way? why is this SEO library not respecting the head.html in the project?

How do I apply CSS rules on Laravel 8's mail template?

I am trying to create an email that is sent to customers after they place an order. I am using Laravel 8 and installed it using the command: php artisan make:mail OrderPlaced - this created all the necessary files. I then used: php artisan vendor:publish and published all the mail blade.php files:
This is my routes file, it is sent up so I can quickly design what my email will look like without continually sending emails:
/* Test email route */
Route::get('/mailable', function () {
$order = \App\Models\Order::find(1);
return new \App\Mail\OrderPlaced($order);
});
This is my OrderPlaced.php Mail controller:
public function build()
{
return $this->markdown('emails.orders.placed')
->to($this->order->billing_email, $this->order->billing_name)
->subject($this->order->billing_name . "'s Order");
}
My issue is that I am trying to apply CSS to my placed.blade.php file. It current looks like this:
#component('mail::message')
<h1>Order Received</h1>
<p>Thank you for ordering with Mobile Mastery and we are so hyped that you decided to make us part of upgrading
your gaming experience. Your order is being prepared and shipped currently, but in the mean time do NOT delete
this email as you may need it, for example, to return an item. You order details are as follows:</p>
-- OTHER ORDER RELATED STUFF --
#endcomponent
You can see that the title has a <h1> tags and the info has <p> tags but in the actual email, only the <h1> tag is applied and the <p> is shown on screen:
Can anyone tell me how to style Laravel's #component('mail::message') effectively or point me to a good page for it? Thanks
Probably the data is escaped. You can see that the mail message blade has this
{{-- Body --}}
{{ $slot }}
Explanation from doc:
By default, Blade {{ }} statements are automatically sent through PHP's htmlspecialchars function to prevent XSS attacks. If you do not want your data to be escaped, you may use the following syntax:
Hello, {!! $name !!}
Read more
https://laravel.com/docs/8.x/blade#displaying-unescaped-data

How can I specify the optional parameters in the dynamic routing?

Suppose I have a page that will show the details of each chapter in the book. User can navigate to other chapters from that page, as the screen has buttons of chapters in the sidebar, and the main content shows the details of the chapter.
Now the user will navigate to that page from a list of books. At the page information, there's no chapter information of that book.
Now if the URL is \bookSlug, so the page will show the details of the first chapter, even it is not mentioned in the URL, it will fetch the list of chapters then fetch the details of the first chapter from that list. This behaviour remains the same for URL \bookSlug\firstChapterSlug.
So, in react-router I used to do it like this.
<Route path={'/:bookId/:chapterId?'} component={ChapterDetails} >
And on the page, I handle the params, that id the chapterId is undefined to just fetch the first chapter or just fetch the chapter mentioned in the chapterId param.
Now, I'm stuck here,
<Link href={'/[bookSlug]/[chapterSlug]' as={'/someBookName'} >
It is just not working, even I have marked the params in the getStaticPaths optional GetStaticPaths<Props, {bookSlug: string, chapterSlug?: string}> s that I can write logic.
How can I achieve that react-router behaviour here in nextJS dynamic routing?
Since Next 9.5 you can do it by using optional catch-all routes.
You would have a route like this /[bookId]/[[...chapterId]].
And to navigate, since Next 9.5.3 you don't need "as" property in Link so Next sould handle this correctly :
<Link href='/some-book'/>
Navigation like that is not possible and incorrect with nextjs, if you provide href='/[bookSlug]/[chapterSlug]' you have to provide as='/some-book/some-chapter'
<Link href={'/[bookSlug]/[chapterSlug]' as={'/someBookName'} />
// this will produce an error
Error: The provided as value (/some-book) is incompatible with the href value (/[bookSlug]/[chapterSlug])
Possible soutions
There are two possible solutions for what you are trying to achieve
If you want the route /some-book to match with [bookSlug] and display the page for the book details and only display some chapter you have to create an index.tsx file which will be used to fetch only the book details and data for the first chapter and return a new page component from it. For example, this is what the pages folder structure might look like,
- pages
- [bookSlug]
- index.tsx
- [chapterSlug].tsx
// index.tsx can be used to fetch and display the book details and first chapter
And you have to explicitly navigate to that page like below
// for navigating to /some-book (which will display only the first chapter)
<Link href='/[bookSlug]' as={'/some-book'} />
// for navigating to /some-book/some-chapter
<Link href='/[bookSlug]/[chapterSlug]' as='/some-book/some-chapter'/>
The second solution is to only keep the [bookSlug] part of the dynamic route and fetch the book details and data for all the chapters and pass it as props. To display each chapter details page make use of shallow-routing.
When it comes to navigating to each chapter you have to make use of router.push instead of the Linkcomponent.
If you were thinking of conditionally returning paths from the function getStaticPaths where you only provide the value for param bookSlug and omit chapterSlug something like { paths: [{ params: { bookSlug: 'some-book'} }]}, this will not work.
For /[bookSlug]/[chapterSlug].js if you try to do something like that it will generate a error at build time
Error: A required parameter (chapterSlug) was not provided as a string in getStaticPaths for /[bookSlug]/[chapterSlug]

How to specify a function on a link

I am new to WordPress development. I am coming from Symfony and vanilla PHP development.
I want to assign a "route" or a function to generate an XML file for a specific post type.
I know that I can get the post information with WordPress functions like get_post_meta.
I don't know the how to assign a function to a link
DOWNLOAD XML.
What is the "WordPress way" to do this?
Wouldn't an Ajax call do the job?
I'm a new in WP also. So I did this way:
1) I made a template myxmltemplate.php in /wp-content/themes/mytheme/myxmltemplate.php starting with:
/**
* Template Name: XML
*/
2) I created a page with template XML with url for example example.com/xml/
3) I put all my code into myxmltemplate.php which generates XML code I need
4) after that I can make a link like this
DOWNLOAD XML
Maybe there is a better way to make routes with xml-generating (like in functions, but for me it's the simplest).

How can I make Meteor templates available to targeted audiences via an URL?

I want to build a Blog, of sorts, with Meteor but, rather than just have a Blog such as platypus.meteor.com, I want to create a separate Meteor template for each Blog "post" and then send a link to select people such as "platypus.meteor.com/thispost"
In this way, the person would only see the post I intend them to see; to see others, they would have to guess at other values, such as "/thatpost", "/theotherpost" etc.
And in my case, if they stumbled across them, no big deal.
This is my plan:
Create one template at a time:
<template name="thispost">
. . .
</template>
...and then allow access to that to whomever I apprise of its availability (that is, they simply enter the link I send them into their browser).
I don't know what sort of routing I need to set up; I'm open to either IronRouter or FlowRouter. At any rate, I want an URL like "platypus.meteor.com/thispost" (after a "meteor deploy platypus" of this project) to show the user the contents of that Template and nothing else.
So my question is: what do I have to do, routing-wise, to accomplish this?
How about simply:
Router.route("/:templateName/:postId",{
template: this.params.templateName,
data: function(){ return Posts.findOne({ _id: this.params.postId })
});
Then you can generically share any post with any template and have the template name appear right in the route.

Resources