This commit is contained in:
Stefanescu Mihai
2026-03-18 11:40:20 +02:00
parent 0cdf5b7082
commit a4383337f4
69 changed files with 5890 additions and 26 deletions
@@ -0,0 +1,93 @@
<x-app-layout>
<x-slot name="header">
<div class="flex items-center justify-between">
<h2 class="font-semibold text-xl text-gray-800 leading-tight">
{{ __('Tracking Snippet') }}: {{ $website->name }}
</h2>
<a href="{{ route('websites.show', $website) }}" class="text-sm text-gray-600 hover:text-gray-900">
&larr; {{ __('Back to website') }}
</a>
</div>
</x-slot>
<div class="py-12">
<div class="max-w-3xl mx-auto sm:px-6 lg:px-8">
<div class="bg-white overflow-hidden shadow-sm sm:rounded-lg">
<div class="p-6">
<h3 class="text-lg font-medium text-gray-900 mb-2">{{ __('Install the tracking code') }}</h3>
<p class="text-sm text-gray-600 mb-6">
{{ __('Copy and paste the following code snippet into the') }}
<code class="text-sm bg-gray-100 px-1.5 py-0.5 rounded">&lt;head&gt;</code>
{{ __('section of every page on') }}
<strong>{{ $website->domain }}</strong>.
</p>
<div class="relative" x-data="{ copied: false }">
<pre class="bg-gray-900 text-gray-100 rounded-lg p-4 text-sm overflow-x-auto"><code id="snippet-code">{{ $website->embedSnippet() }}</code></pre>
<button
@click="
navigator.clipboard.writeText(document.getElementById('snippet-code').textContent);
copied = true;
setTimeout(() => copied = false, 2000);
"
class="absolute top-3 right-3 inline-flex items-center gap-1 rounded-md bg-gray-700 px-2.5 py-1.5 text-xs font-medium text-gray-200 hover:bg-gray-600 transition"
>
<span x-show="!copied">{{ __('Copy') }}</span>
<span x-show="copied" x-cloak>{{ __('Copied!') }}</span>
</button>
</div>
</div>
</div>
<div class="mt-6 bg-white overflow-hidden shadow-sm sm:rounded-lg">
<div class="p-6">
<h3 class="text-lg font-medium text-gray-900 mb-2">{{ __('Track custom events') }}</h3>
<p class="text-sm text-gray-600 mb-4">
{{ __('After the tracking script is loaded, you can send custom events from anywhere in your JavaScript:') }}
</p>
<pre class="bg-gray-900 text-gray-100 rounded-lg p-4 text-sm overflow-x-auto"><code>// Basic event
ta('event', 'signup');
// Event with details
ta('event', 'purchase', {
category: 'ecommerce',
action: 'checkout',
label: 'premium_plan',
value: 29.99,
properties: {
plan: 'premium',
period: 'monthly'
}
});</code></pre>
</div>
</div>
<div class="mt-6 bg-white overflow-hidden shadow-sm sm:rounded-lg">
<div class="p-6">
<h3 class="text-lg font-medium text-gray-900 mb-4">{{ __('Details') }}</h3>
<dl class="grid grid-cols-1 gap-4 sm:grid-cols-2">
<div>
<dt class="text-sm font-medium text-gray-500">{{ __('Tracking ID') }}</dt>
<dd class="mt-1 text-sm text-gray-900 font-mono">{{ $website->tracking_id }}</dd>
</div>
<div>
<dt class="text-sm font-medium text-gray-500">{{ __('Domain') }}</dt>
<dd class="mt-1 text-sm text-gray-900">{{ $website->domain }}</dd>
</div>
<div>
<dt class="text-sm font-medium text-gray-500">{{ __('Script URL') }}</dt>
<dd class="mt-1 text-sm text-gray-900 font-mono break-all">{{ route('tracking.script', $website->tracking_id) }}</dd>
</div>
<div>
<dt class="text-sm font-medium text-gray-500">{{ __('Collection Endpoint') }}</dt>
<dd class="mt-1 text-sm text-gray-900 font-mono break-all">{{ route('collect.store') }}</dd>
</div>
</dl>
</div>
</div>
</div>
</div>
</x-app-layout>