Laravel 5.4邮件Markdown 2按钮内联

时间:2018-11-27 08:59:57

标签: laravel email markdown

我想知道如何将按钮彼此相邻放置。

enter image description here

现在它在单独的行上。

@component('mail::message')
    Dear {{$vendor_name}}

    Product {{$product_id}} : {{$product_name}} price id : {{$price_id}} will expire on {{$date_expire}}.
    Please renew price.


@component('mail::button', ['url' => 'http://phuketjettour.com/', 'color' => 'green'])
    Phuket Jet Tour
@endcomponent
@component('mail::button', ['url' => 'http://phuketjettour.com/s/vendors'])
    Vendor submission
@endcomponent
    Thanks,<br>
    Phuket Jet Tour

@endcomponent

6 个答案:

答案 0 :(得分:1)

将变量传递到刀片模板时,请使用单引号(')而不是双引号(“)。

// this will decode your json data that you're getting in the post data
$postdata = json_decode($postdata, true);

$data = [];
foreach ($postdata as $key => $value) {        
    $data[$key]['product_id'] = $value['product']['id'];
    $data[$key]['product_name'] = $value['product']['product_name'];
    $data[$key]['quantity'] = $value['quantity'];
}

// $data now will have data as following structure

$data = [[
    'product_id' => 2,
    'product_name' => "Item two",
    'quantity' => 7   

],
[
    'product_id' => 2,
    'product_name' => "Item two",
    'quantity' => 7   

]];

$order = Order::create($data);

呈现此代码:

编辑您的应用程序\邮件

$btn_style = " color: #FFF; border: 1px solid #FEFEFE; padding: 5px 30px;";    
$buttons = '<span style="text-align: center; width: 100%; display: inline-block;">
                <a href="'. url('/login') .'" style="background: #449a44; '.$btn_style.'"> Accept </a>
                <a href="'. url('/some/url/'. $id) .'" style="background: #b76161; '.$btn_style.'"> Decline </a>
            </span>';

刀片模板查看\电子邮件

$this
    ->subject('Subject')
    ->markdown('emails.tempalte')
    ->with([
      'buttons' => $buttons,
    ]);

希望这会有所帮助。

答案 1 :(得分:1)

内嵌按钮的动态数量

对我来说,以下工作在 Laravel 降价邮件中创建了 2、3、4 个(动态数量)按钮内联:

3 inline buttons without headline

1) 为您的自定义组件添加一个新目录

首先让我们扩展邮件配置以包含我们的组件新目录:

config/mail.php

<?php 

// ...

'markdown' => [
    'theme' => 'default',

    'paths' => [
        resource_path('views/vendor/mail'),
        resource_path('views/emails/components') // <-- This line was added
    ],
],

2) 为内嵌按钮创建新组件

您需要同时创建组件的 HTML 和文本版本。否则,您将收到 InvalidArgumentException“未找到查看 $name”:

www/resources/views/emails/components/html/buttons.blade.php

这是 HTML 文件:

<table class="action" align="center" width="100%" cellpadding="0" cellspacing="0" role="presentation">
<tr>
<td align="center">
<table width="100%" border="0" cellpadding="0" cellspacing="0" role="presentation">
<tr>
<td align="center">
<table border="0" cellpadding="0" cellspacing="0" role="presentation">
@if(null !== ($headline ?? null))
<tr><td><h2 style="text-align: center;">{{ $headline }}</h2></td></tr>
@endif
<tr>
<td>
@foreach($buttons as $button)
<a href="{{ $button['url'] }}" class="button button-{{ $button['color'] ?? 'primary' }}" target="_blank" rel="noopener">{!! $button['slot'] !!}</a>
@endforeach
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>

www/resources/views/emails/components/text/buttons.blade.php

这是文本文件

@if(null !== ($headline ?? null))
{{ $headline }}
------------------------------
@endif
@foreach($buttons as $button)
{!! $button['slot'] !!}: {{ $button['url'] }}
@endforeach

3) 在您的邮件中包含新组件:

现在您可以像这样在降价电子邮件中包含该组件:

带有2个内嵌按钮和一个标题的示例:

2 inline buttons with headline

@component('mail::buttons', [
    'headline' => 'Share link',
    'buttons' => [
        [
            'url' => 'https://wa.me/?text=' . urlencode('Whatsapp text'),
            'slot' => 'WhatsApp',
        ],[
            'url' => 'https://t.me/share/url?text=' . urlencode('telegram text'),
            'slot' => 'Telegram',
        ]
    ]
])
@endcomponent

带有3 个内嵌按钮 没有标题的示例:

3 inline buttons without headline

@component('mail::buttons', [
    'buttons' => [
        [
            'url' => 'https://wa.me/?text=' . urlencode('Whatsapp text'),
            'slot' => 'WhatsApp',
        ],[
            'url' => 'https://t.me/share/url?text=' . urlencode('telegram text'),
            'slot' => 'Telegram',
        ],[
            'url' => 'https://twitter.com/intent/tweet?text=' . urlencode('Twitter text'),
            'slot' => 'Twitter',
        ]
    ]
])
@endcomponent

具有不同颜色3个内嵌按钮的示例:

3 inline buttons with different colours

@component('mail::buttons', [
    'buttons' => [
        [
            'url' => 'https://wa.me/?text=' . urlencode('Whatsapp text'),
            'slot' => 'WhatsApp',
            'color' => 'blue' // This is the default
        ],[
            'url' => 'https://t.me/share/url?text=' . urlencode('telegram text'),
            'slot' => 'Telegram',
            'color' => 'green'
        ],[
            'url' => 'https://twitter.com/intent/tweet?text=' . urlencode('Twitter text'),
            'slot' => 'Twitter',
            'color' => 'red'
        ]
    ]
])
@endcomponent

答案 2 :(得分:0)

您可以将其放在一个<div>中 例如:

<div class = "row>

您的按钮在这里

</div>

如果没有帮助,请分享您的代码


尝试一下:

<span style="display: inline;">

@component('mail::button', ['url' => 'http://phuketjettour.com/', 'color' => 'green'])
    Phuket Jet Tour
@endcomponent
@component('mail::button', ['url' => 'http://phuketjettour.com/s/vendors'])
    Vendor submission
@endcomponent

</span>

答案 3 :(得分:0)

这只是一种解决方法。我已经检查了laravel项目中的电子邮件。

尝试用它代替按钮的组件:

<a href = "http://phuketjettour.com/" class="button button-green"> Phuket Jet Tour</a>
<a href = "http://phuketjettour.com/" class="button button-blue">SAMPLE !</a>

它内联您的按钮。然后只需调整其他元素即可。如果您想将按钮放在减价标记上,那么您会喜欢:

在您的降价中:

$button1= "   <a href = "http://phuketjettour.com/" class="button button-green"> Phuket Jet Tour</a>";
$button2 = "<a href = "http://phuketjettour.com/" class="button button-blue">SAMPLE !</a>";

  $emailMarkdown = $this->markdown('your_email_template')
                ->subject('your_subject)
                //you will define here the variables you need to pass in the template
                ->with([    
                   'emailBody' => $emailBody,
                   'button_first' => $button1,
                   'button_second' => $button2,
                ]);

     return $emailMarkdown;

然后在电子邮件模板上:

@component('mail::message')
        Dear {{$vendor_name}}

        Product {{$product_id}} : {{$product_name}} price id : {{$price_id}} will expire on {{$date_expire}}.
        Please renew price.

    {!!$button_first!!} {!!$button_second!!}
@endcomponent

答案 4 :(得分:0)

我已经这样做了,当然,css应该放在单独的文件中

$a = mysqli_query(
    $koneksi, 
    "INSERT INTO `tbl_timesheet`(`nik`, `id_annual`, `tgl`, `shift`, `project_desc`, `loc`) VALUES ('$nik', '$id_annual_leave', 'f' '$shift', '$project', '$cluster')"
);

答案 5 :(得分:-1)

要解决此问题,只需将此代码放在电子邮件刀片文件中:

<div style="text-align: center">
  <a href="{{ $link }}" class="button button-red">Cancel</a>
  <a href="{{ $link }}" class="button button-blue">Reschedule</a>
  <a href="{{ $link }}" class="button button-green">Confirm</a>
</div>