quote generator

import React from "react"; const QuoteGenerator = () => { // This contains the HTML that you can copy directly to your blogger website const copyableHtml = `

Daily Inspiration Quotes

Find wisdom and motivation at the click of a button

"

Click the button below to generate an inspirational quote.

"

Quote Categories

How to Use

• • Click "New Quote" to generate a random inspirational quote
• • Select a category to get quotes from a specific theme
• • Click "Copy Quote" to copy the current quote to your clipboard
• • Use "Tweet" to share the quote on Twitter

`; return (

{/* Header */}

PURE HTML & CSS TOOL

Daily Inspiration Quotes

A simple yet powerful quote generator for your Blogger website

{/* Preview */}

Live Preview

Daily Inspiration Quotes

Find wisdom and motivation at the click of a button

"

Click the button below to generate an inspirational quote.

"

Quote Categories

How to Use

• • Click "New Quote" to generate a random inspirational quote
• • Select a category to get quotes from a specific theme
• • Click "Copy Quote" to copy the current quote to your clipboard
• • Use "Tweet" to share the quote on Twitter

{/* Features */}

Categorized Quotes

Browse through different categories of quotes based on themes like motivation, success, and happiness.

Easy Sharing

Copy quotes to your clipboard or share them directly on Twitter with a single click.

Simple Integration

Effortlessly add this tool to your Blogger site with a simple copy and paste.

{/* Copy HTML Section */}

Get the Code for Your Blogger Website

Copy and paste the HTML below into your Blogger HTML/JavaScript widget or into a blog post in HTML view mode.

{copyableHtml}

{/* Installation Instructions */}

How to Install on Blogger

1

Copy the HTML code

Click the "Copy HTML" button above to copy all of the necessary code.

2

Go to your Blogger dashboard

Navigate to your blog's dashboard and select the page or post where you want to add the tool.

3

Add an HTML/JavaScript widget

Click on "Layout" in your Blogger dashboard, then "Add a Gadget" and select "HTML/JavaScript".

4

Paste the HTML code

Paste the copied HTML code into the content area of the widget.

5

Save and publish

Click "Save" to apply the changes, then view your blog to see the quote generator in action.

); }; export default QuoteGenerator; import { Toaster } from "@/components/ui/toaster"; import { Toaster as Sonner } from "@/components/ui/sonner"; import { TooltipProvider } from "@/components/ui/tooltip"; import { QueryClient, QueryClientProvider } from "@tanstack/react-query"; import { BrowserRouter, Routes, Route } from "react-router-dom"; import Index from "./pages/Index"; import NotFound from "./pages/NotFound"; import CharacterCounter from "./pages/CharacterCounter"; import QuoteGenerator from "./pages/QuoteGenerator"; const queryClient = new QueryClient(); const App = () => ( } /> } /> } /> {/* ADD ALL CUSTOM ROUTES ABOVE THE CATCH-ALL "*" ROUTE */} } /> ); export default App;