mirror of
https://github.com/plausible/analytics.git
synced 2024-12-30 21:16:27 +03:00
79b9f72b52
* UI to create custom domains * Only call ssh once per domain * Update copy for custom domain setup * Use correct user for ssh
247 lines
15 KiB
Elixir
247 lines
15 KiB
Elixir
<div class="pt-24"></div>
|
|
<div class="max-w-md mx-auto flex justify-between">
|
|
<a href="/<%= URI.encode_www_form(@site.domain) %>"><h1>Settings for <%= @site.domain %></h1></a>
|
|
</div>
|
|
<div class="max-w-md mx-auto bg-white shadow-md rounded rounded-t-none border-t-2 border-indigo-lightest px-8 pt-6 pb-8 mt-10">
|
|
<div class="flex items-center justify-between">
|
|
<h2>General</h2>
|
|
</div>
|
|
|
|
<div class="my-4 border-b border-grey-light"></div>
|
|
|
|
<%= form_for @changeset, "/#{URI.encode_www_form(@site.domain)}/settings", [class: "max-w-xs"], fn f -> %>
|
|
<div class="my-4">
|
|
<%= label f, :domain, class: "block text-grey-darker text-sm font-bold mb-2" %>
|
|
<%= text_input f, :domain, class: "transition bg-grey-lighter appearance-none border border-transparent rounded w-full p-2 text-grey-darker leading-normal appearance-none focus:outline-none focus:border-grey-light ", disabled: "disabled" %>
|
|
<%= error_tag f, :domain %>
|
|
</div>
|
|
<div class="my-4">
|
|
<%= label f, :timezone, "Reporting Timezone", class: "block text-grey-darker text-sm font-bold mb-2" %>
|
|
<div class="inline-block relative w-full">
|
|
<%= select f, :timezone, Plausible.Timezones.options(), class: "block appearance-none w-full bg-grey-lighter text-grey-darker cursor-pointer hover:border-grey p-2 pr-8 rounded leading-normal focus:outline-none" %>
|
|
<div class="pointer-events-none absolute pin-y pin-r flex items-center px-2 text-red">
|
|
<svg class="fill-current h-4 w-4" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path d="M9.293 12.95l.707.707L15.657 8l-1.414-1.414L10 10.828 5.757 6.586 4.343 8z"/></svg>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<%= submit "Save changes", class: "button mt-4" %>
|
|
<% end %>
|
|
</div>
|
|
|
|
<div class="max-w-md mx-auto bg-white shadow-md rounded rounded-t-none border-t-2 border-indigo-lightest px-8 pt-6 pb-8 mt-10" id="visibility">
|
|
<div class="flex items-center justify-between">
|
|
<h2>Visibility</h2>
|
|
</div>
|
|
|
|
<div class="my-4 border-b border-grey-light"></div>
|
|
<%= if @site.public do %>
|
|
Stats for <%= @site.domain %> are currently <b>public</b>. Anyone with the following link can view the stats:
|
|
<div class="relative text-sm mt-4">
|
|
<input type="text" id="public-link" value="https://plausible.io/<%= URI.encode_www_form(@site.domain) %>" class="transition bg-grey-lighter appearance-none border border-transparent rounded w-full p-2 pr-16 text-grey-darker appearance-none focus:outline-none focus:border-grey-light" />
|
|
<a onclick="var input = document.getElementById('public-link'); input.focus(); input.select(); document.execCommand('copy');" href="javascript:void(0)" class="absolute pin-r text-indigo-darker font-bold p-2">
|
|
<svg class="feather-sm"><use xlink:href="#feather-copy" /></svg>
|
|
</a>
|
|
</div>
|
|
<%= button("Make stats private", to: "/sites/#{URI.encode_www_form(@site.domain)}/make-private", method: "POST", class: "button mt-8") %>
|
|
<% else %>
|
|
<div class="text-grey-darker">
|
|
Stats for <%= @site.domain %> are currently <b>private</b>. You are the only person who can see them.
|
|
If you choose to make your stats public, anyone with the link will be able to view them.
|
|
</div>
|
|
<%= button("Make stats public", to: "/sites/#{URI.encode_www_form(@site.domain)}/make-public", method: "POST", class: "button mt-8") %>
|
|
<% end %>
|
|
|
|
<div class="mt-16">
|
|
<h2>Shared links</h2>
|
|
|
|
<div class="my-4 border-b border-grey-light"></div>
|
|
|
|
<div class="my-4">
|
|
You can share your stats privately by generating a shared link. The links are impossible to guess and
|
|
you can add password protection for extra security.
|
|
</div>
|
|
|
|
<%= for link <- @shared_links do %>
|
|
<div class="flex relative w-full mt-2 text-sm">
|
|
<input type="text" id="<%= link.slug %>" readonly="readonly" value="<%= shared_link_dest(link) %>" class="transition bg-grey-lighter appearance-none border border-transparent rounded rounded-r-none w-full p-2 text-grey-darker appearance-none focus:outline-none focus:border-grey-light" />
|
|
<button onclick="var input = document.getElementById('<%= link.slug %>'); input.focus(); input.select(); document.execCommand('copy');" href="javascript:void(0)" class="py-2 px-4 bg-grey-lighter text-indigo-darker rounded-none border-r border-grey-light">
|
|
<svg class="feather-sm"><use xlink:href="#feather-copy" /></svg>
|
|
</button>
|
|
<%= button(to: "/sites/#{URI.encode_www_form(@site.domain)}/shared-links/#{link.slug}", method: :delete, class: "py-2 px-4 bg-grey-lighter text-red-dark rounded-l-none", data: [confirm: "Are you sure you want to delete this shared link? The stats will not be accessible with this link anymore."]) do %>
|
|
<svg class="feather-sm"><use xlink:href="#feather-trash-2" /></svg>
|
|
<% end %>
|
|
</div>
|
|
<% end %>
|
|
</div>
|
|
|
|
<%= link("+ New link", to: "/sites/#{URI.encode_www_form(@site.domain)}/shared-links/new", class: "button mt-4") %>
|
|
</div>
|
|
|
|
<div class="max-w-md mx-auto bg-white shadow-md rounded rounded-t-none border-t-2 border-indigo-lightest px-8 pt-6 pb-8 mt-10">
|
|
<h2>Goals</h2>
|
|
<div class="my-4 border-b border-grey-light"></div>
|
|
<div>
|
|
<%= if Enum.count(@goals) > 0 do %>
|
|
<%= for goal <- @goals do %>
|
|
<div class="border-b border-grey-light py-3 flex justify-between">
|
|
<small class="font-bold"><%= goal_name(goal) %></small>
|
|
<%= button("❌", to: "/#{URI.encode_www_form(@site.domain)}/goals/#{goal.id}", method: :delete, class: "text-sm", data: [confirm: "Are you sure you want to remove goal #{goal_name(goal)}? This will just affect the UI, all of your analytics data will stay intact."]) %>
|
|
</div>
|
|
<% end %>
|
|
<% else %>
|
|
<div>No goals configured for this site yet</div>
|
|
<% end %>
|
|
</div>
|
|
|
|
<%= link("+ Add goal", to: "/#{URI.encode_www_form(@site.domain)}/goals/new", class: "button mt-6") %>
|
|
</div>
|
|
|
|
<div class="max-w-md mx-auto bg-white shadow-md rounded rounded-t-none border-t-2 border-indigo-lightest px-8 pt-6 pb-8 mt-10" id="google-auth">
|
|
<div class="flex items-center justify-between">
|
|
<h2>Google Integration</h2>
|
|
</div>
|
|
|
|
<div class="my-4 border-b border-grey-light"></div>
|
|
<div class="text-grey-darker my-4">
|
|
Integrating with your Google account allows Plausible to show more information about your websites' performance on their search engine.
|
|
</div>
|
|
|
|
<%= if @site.google_auth do %>
|
|
<div class="py-2"></div>
|
|
<span class="text-grey-darker">Connected Google account: <b><%= @site.google_auth.email %></b></span>
|
|
|
|
<%= if @site.google_auth.property && !(@site.google_auth.property in @search_console_domains) do %>
|
|
<p class="text-grey-darker mt-6 font-bold">
|
|
NB: Your Google account does not have access to your currently configured property, <%= @site.google_auth.property %>. Please select a verified property from the list below.
|
|
</p>
|
|
<% else %>
|
|
<p class="text-grey-darker mt-6">
|
|
Select the Google Search Console property you would like to pull keyword data from. If you don't see your domain, <%= link("set it up and verify", to: "https://docs.plausible.io/google-search-console-integration#1-add-your-site-on-the-search-console", class: "text-indigo") %> on Search Console first.
|
|
</p>
|
|
<% end %>
|
|
|
|
<%= form_for Plausible.Site.GoogleAuth.changeset(@site.google_auth), "/#{URI.encode_www_form(@site.domain)}/settings/google", [class: "max-w-xs"], fn f -> %>
|
|
<div class="my-6">
|
|
<div class="inline-block relative w-full">
|
|
<%= select f, :property, @search_console_domains, prompt: "(Choose property)", class: "block appearance-none w-full bg-grey-lighter text-grey-darker cursor-pointer hover:border-grey p-2 pr-8 rounded leading-normal focus:outline-none" %>
|
|
<div class="pointer-events-none absolute pin-y pin-r flex items-center px-2 text-red">
|
|
<svg class="fill-current h-4 w-4" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path d="M9.293 12.95l.707.707L15.657 8l-1.414-1.414L10 10.828 5.757 6.586 4.343 8z"/></svg>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<%= submit "Save", class: "button" %>
|
|
<% end %>
|
|
<% else %>
|
|
<%= button("Continue with Google", to: Plausible.Google.Api.authorize_url(@site.id), class: "button mt-4") %>
|
|
|
|
<div class="text-grey-darker mt-8">
|
|
NB: You also need to set up your site on <%= link("Google Search Console", to: "https://search.google.com/search-console/about") %> for the integration to work. <%= link("Read the docs", to: "https://docs.plausible.io/google-search-console-integration", class: "text-indigo") %>
|
|
</div>
|
|
<% end %>
|
|
</div>
|
|
|
|
<div class="max-w-md mx-auto bg-white shadow-md rounded rounded-t-none border-t-2 border-indigo-lightest px-8 pt-6 pb-8 mt-10" id="email-reports">
|
|
<h2>Email reports</h2>
|
|
|
|
<div class="my-4 border-b border-grey-light"></div>
|
|
|
|
<div class="my-8 flex items-center">
|
|
<%= if @weekly_report do %>
|
|
<%= button(to: "/sites/#{URI.encode_www_form(@site.domain)}/weekly-report/disable", method: :post, class: "border rounded-full border-grey flex items-center cursor-pointer w-8 bg-green justify-end") do %>
|
|
<span class="rounded-full border w-4 h-4 border-grey shadow-inner bg-white shadow"></span>
|
|
<% end %>
|
|
<% else %>
|
|
<%= button(to: "/sites/#{URI.encode_www_form(@site.domain)}/weekly-report/enable", method: :post, class: "border rounded-full border-grey flex items-center cursor-pointer w-8 justify-start") do %>
|
|
<span class="rounded-full border w-4 h-4 border-grey shadow-inner bg-white shadow"></span>
|
|
<% end %>
|
|
<% end %>
|
|
<span class="ml-2">Send a weekly email report every Monday</span>
|
|
</div>
|
|
<%= if @weekly_report do %>
|
|
<div class="text-sm text-grey-darker mt-6">
|
|
<h4 class="my-2">Weekly report recipients</h4>
|
|
<%= for recipient <- @weekly_report.recipients do %>
|
|
<div class="p-3 flex justify-between bg-grey-lighter rounded my-2 max-w-sm">
|
|
<span><svg class="feather mr-1" style="transform: translateY(0.05em)"><use xlink:href="#feather-mail" /></svg><%= recipient %></span>
|
|
<%= button("❌", to: "/sites/#{URI.encode_www_form(@site.domain)}/weekly-report/recipients/#{recipient}", method: :delete) %>
|
|
</div>
|
|
<% end %>
|
|
<%= form_for @conn, "/sites/#{URI.encode_www_form(@site.domain)}/weekly-report/recipients", fn f -> %>
|
|
<div class="flex justify-between my-2 max-w-sm">
|
|
<%= email_input f, :recipient, class: "transition bg-grey-lighter appearance-none border border-transparent rounded w-full p-2 text-grey-darker leading-normal appearance-none focus:outline-none focus:border-grey-light", style: "flex-grow: 2", placeholder: "recipient@example.com" %>
|
|
<%= submit "Add recipient", class: "button rounded-l-none whitespace-no-wrap" %>
|
|
</div>
|
|
<% end %>
|
|
</div>
|
|
<% end %>
|
|
<div class="my-8 border-b border-grey-light"></div>
|
|
<div class="my-8 flex items-center">
|
|
<%= if @monthly_report do %>
|
|
<%= button(to: "/sites/#{URI.encode_www_form(@site.domain)}/monthly-report/disable", method: :post, class: "border rounded-full border-grey flex items-center cursor-pointer w-8 bg-green justify-end") do %>
|
|
<span class="rounded-full border w-4 h-4 border-grey shadow-inner bg-white shadow"></span>
|
|
<% end %>
|
|
<% else %>
|
|
<%= button(to: "/sites/#{URI.encode_www_form(@site.domain)}/monthly-report/enable", method: :post, class: "border rounded-full border-grey flex items-center cursor-pointer w-8 justify-start") do %>
|
|
<span class="rounded-full border w-4 h-4 border-grey shadow-inner bg-white shadow"></span>
|
|
<% end %>
|
|
<% end %>
|
|
<span class="ml-2">Send a monthly email report on 1st of the month</span>
|
|
</div>
|
|
<%= if @monthly_report do %>
|
|
<div class="text-sm text-grey-darker mt-6">
|
|
<h4 class="my-2">Monthly report recipients</h4>
|
|
<%= for recipient <- @monthly_report.recipients do %>
|
|
<div class="p-3 flex justify-between bg-grey-lighter rounded my-2 max-w-sm">
|
|
<span><svg class="feather mr-1" style="transform: translateY(0.05em)"><use xlink:href="#feather-mail" /></svg><%= recipient %></span>
|
|
<%= button("❌", to: "/sites/#{URI.encode_www_form(@site.domain)}/monthly-report/recipients/#{recipient}", method: :delete) %>
|
|
</div>
|
|
<% end %>
|
|
<%= form_for @conn, "/sites/#{URI.encode_www_form(@site.domain)}/monthly-report/recipients", fn f -> %>
|
|
<div class="flex justify-between my-2 max-w-sm">
|
|
<%= email_input f, :recipient, class: "transition bg-grey-lighter appearance-none border border-transparent rounded w-full p-2 text-grey-darker leading-normal appearance-none focus:outline-none focus:border-grey-light", style: "flex-grow: 2", placeholder: "recipient@example.com" %>
|
|
<%= submit "Add recipient", class: "button rounded-l-none whitespace-no-wrap" %>
|
|
</div>
|
|
<% end %>
|
|
</div>
|
|
<% end %>
|
|
</div>
|
|
|
|
<div class="bg-white max-w-md mx-auto shadow-md rounded rounded-t-none border-t-2 border-indigo-lightest px-8 pt-6 pb-8 mb-4 mt-16" id="custom-domain">
|
|
<h2>Custom domain</h2>
|
|
<div class="my-4">
|
|
Some browsers and extensions block analytics services. To get around that, Plausible offers a quick and easy way to serve the script from your own custom domain.
|
|
</div>
|
|
<%= if @site.custom_domain do %>
|
|
Configured domain: <b><%= @site.custom_domain.domain %></b>
|
|
<% else %>
|
|
<div class="mt-4">
|
|
<%= link("Add custom domain", to: "/sites/#{URI.encode_www_form(@site.domain)}/custom-domains/new", class: "button") %>
|
|
</div>
|
|
<% end %>
|
|
</div>
|
|
|
|
<%= form_for @conn, "/", [class: "bg-white max-w-md mx-auto shadow-md rounded rounded-t-none border-t-2 border-indigo-lightest px-8 pt-6 pb-8 mb-4 mt-16"], fn f -> %>
|
|
<h2>Javascript snippet</h2>
|
|
<div class="my-4">
|
|
<p>Include this snippet in the <code><head></code> of your website.</p>
|
|
<div class="relative">
|
|
<%= textarea f, :domain, id: "snippet_code", class: "transition overflow-hidden bg-grey-lighter appearance-none border border-transparent rounded w-full p-2 pr-6 text-grey-darker leading-normal appearance-none focus:outline-none focus:bg-white focus:border-grey-light text-xs mt-2 resize-none", value: snippet(@site), rows: 2 %>
|
|
<a onclick="var textarea = document.getElementById('snippet_code'); textarea.focus(); textarea.select(); document.execCommand('copy');" href="javascript:void(0)" class="no-underline text-indigo text-sm hover:underline">
|
|
<svg class="absolute text-indigo" style="top: 24px; right: 12px;" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-copy"><rect x="9" y="9" width="13" height="13" rx="2" ry="2"></rect><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"></path></svg>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<% end %>
|
|
|
|
<div class="max-w-md mx-auto bg-white shadow-md rounded rounded-t-none border-t-2 border-red-dark px-8 pt-6 pb-8 mt-16 mb-24">
|
|
<div class="flex items-center justify-between">
|
|
<h2>Delete site data</h2>
|
|
</div>
|
|
|
|
<div class="my-4 border-b border-grey-light"></div>
|
|
|
|
<p class="text-lg">Deleting the site removes all stats you've collected</p>
|
|
<%= link "Delete #{@site.domain}", to: "/#{URI.encode_www_form(@site.domain)}", method: :delete, class: "button bg-red-dark mt-4", data: [confirm: "Deleting the site data cannot be reversed. Are you sure?"] %>
|
|
</div>
|