PHPackages                             mahmoudelsherbeny/laravel-grapes - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Utility &amp; Helpers](/categories/utility)
4. /
5. mahmoudelsherbeny/laravel-grapes

ActiveLibrary[Utility &amp; Helpers](/categories/utility)

mahmoudelsherbeny/laravel-grapes
================================

laravel grapes is a cms drag and drop page builder

v2.0.1(1y ago)05MITCSS

Since Mar 19Pushed 1y agoCompare

[ Source](https://github.com/MahmoudElsherbeny/laravel-grapes)[ Packagist](https://packagist.org/packages/mahmoudelsherbeny/laravel-grapes)[ RSS](/packages/mahmoudelsherbeny-laravel-grapes/feed)WikiDiscussions main Synced 1mo ago

READMEChangelog (3)Dependencies (2)Versions (4)Used By (0)

[![](./laravel-grapes-logo.png)](./laravel-grapes-logo.png)

[![GitHub](https://camo.githubusercontent.com/af8c85778a5e80c4c3bbf1fd3cb2e96b74b8c4025d3e2fd436729f53db0f1bdd/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f6c6963656e73652f4d61686d6f7564456c7368657262656e792f6c61726176656c2d6772617065733f636f6c6f723d253233303030267374796c653d6d6974)](https://camo.githubusercontent.com/af8c85778a5e80c4c3bbf1fd3cb2e96b74b8c4025d3e2fd436729f53db0f1bdd/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f6c6963656e73652f4d61686d6f7564456c7368657262656e792f6c61726176656c2d6772617065733f636f6c6f723d253233303030267374796c653d6d6974)[![Total Download](https://camo.githubusercontent.com/5b4890cdf05f205d0663da501a95ebf5a13e3f5e150f46976a8a571585d98670/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f646d2f6d61686d6f7564656c7368657262656e792f6c61726176656c2d677261706573)](https://camo.githubusercontent.com/5b4890cdf05f205d0663da501a95ebf5a13e3f5e150f46976a8a571585d98670/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f646d2f6d61686d6f7564656c7368657262656e792f6c61726176656c2d677261706573)[![GitHub release (latest by date including pre-releases)](https://camo.githubusercontent.com/36e828fe5510166fea370d5b29c12221d1cb7e6687f32c442309be639f77021c/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f762f72656c656173652f4d61686d6f7564456c7368657262656e792f6c61726176656c2d6772617065733f696e636c7564655f70726572656c6561736573)](https://camo.githubusercontent.com/36e828fe5510166fea370d5b29c12221d1cb7e6687f32c442309be639f77021c/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f762f72656c656173652f4d61686d6f7564456c7368657262656e792f6c61726176656c2d6772617065733f696e636c7564655f70726572656c6561736573)

[![](./screenshots/screenshot_01.png)](./screenshots/screenshot_01.png)

 Table of Contents1. [About Laravel Grapes](#about-laravel-grapes)
2. [Diffrence Between Regular Version And Pro Version](#regular-version-vs-pro-version)
3. [Installation Steps](#installation-steps)
4. [Usage](#usage)
    - [Options Panel](#1-options-panel)
        - [View Components](#view-components)
        - [Preview](#preview)
        - [Full Screen](#full-screen)
        - [View Code](#view-code)
        - [Create New Page](#create-new-page)
        - [Edit Code]()
        - [Component Manager]()
        - [Page Manager](#page-manager)
        - [Clear Canvas](#clear-canvas)
        - [Save Component](#save-component)
        - [Save Changes](#save-changes)
    - [Page Panel](#2-page-panel)
        - [Select Page](#select-page)
        - [Select Device](#select-device)
    - [View Panel](#3-view-panel)
        - [Block Manager](#block-manager)
        - [Layer Manager](#layer-manager)
        - [Component Settings](#component-settings)
        - [Style Manager](#style-manager)
    - [Customize Builder Style Sheet](#customize-builder-style-sheet)
5. [Show Page In Front](#show-page-in-front)
6. [Translations](#translations)
7. [Author](#author)
8. [License](#license)

About Laravel Grapes
--------------------

[](#about-laravel-grapes)

This Package is forked from main package: ()

Laravel Grapes is a library for laravel framework, that offer cms drag and drop page builder for frontend which support all Laravel functionality and help user to change all frontend and content just in simple clicks.

---

Diffrence Between Regular Version And Pro Version
-------------------------------------------------

[](#diffrence-between-regular-version-and-pro-version)

FeatureRegular VersionPro VersionLaravel CSRFyesyesLaravel Auth User ConditionyesyesLaravel Auth Dynamic GuardyesyesMultilingualyesyesDynamic Laravel Shortcode widgets1unlimtedDynamic Routes /{id}Noyes---

Installation Steps
------------------

[](#installation-steps)

```
composer require MahmoudElsherbeny/laravel-grapes
```

```
php artisan vendor:publish --provider="MahmoudElsherbeny\LaravelGrapes\LaravelGrapesServiceProvider" --tag="*"
```

```
php artisan migrate
```

#### Go to config/lg.php

[](#go-to-configlgphp)

```
     [
          'prefix' => 'builder',

          'middleware' => null,
        ],

        /* Define additional translation languages. */
        'languages' => [
            'ar',
            'es',
        ],
    ];`
```

##### 1) routes.prefix

[](#1-routesprefix)

The builder by default come with route `route('page-builder.index')` which consists of [your-domain.com/builder/page-builder](#1-builder_prefix).
you can change the builder prefix to what you want so now the builder load with your new route prefix instead of builder.

##### 2) routes.middleware

[](#2-routesmiddleware)

Assign any middleware you want to the builder for example auth:admin.

Now laravel grapes is working.

Navigate to builder route [your-domain.com/builder\_prefix/page-builder](#1-builder_prefix).

[![](./screenshots/screenshot_02.png)](./screenshots/screenshot_02.png)

---

Usage
-----

[](#usage)

The Controll Panel Consists Of 3 Panels :-

[1) Options Panel](#1-options-panel)

[2) Page Panel](#2-page-panel)

[3) View Panel](#3-view-panel)

[4) Customize Builder Style Sheet](#customize-builder-style-sheet)

### 1. Options Panel

[](#1-options-panel)

[![](./screenshots/options_panel_screenshot.png)](./screenshots/options_panel_screenshot.png)

The options panel consists of 11 buttons :-

- [View Components](#view-components)
- [Preview](#preview)
- [Full Screen](#full-screen)
- [View Code](#view-code)
- [Create New Page](#create-new-page)
- [Edit Code](#edit-code)
- [Component Manager](#component-manager)
- [Page Manager](#page-manager)
- [Clear Canvas](#clear-canvas)
- [Save Component](#save-component)
- [Save Changes](#save-changes)

#### View Components

[](#view-components)

The view component button show grid lines for all components droped in the canvas, this help to to select each component individual for example take a look on the screenshot below.

[![](./screenshots/screenshot_04.png)](./screenshots/screenshot_04.png)

#### Preview

[](#preview)

The preview button help you to show page without pannels like screenshot below

[![](./screenshots/screenshot_preview.png)](./screenshots/screenshot_preview.png)

#### Full Screen

[](#full-screen)

The full screen mode button hide all browser utils and show only the builder.

#### View Code

[](#view-code)

The view code button show you the html and css code of the page like sceenshot below

[![](./screenshots/screenshot_05.png)](./screenshots/screenshot_05.png)

#### Create New Page

[](#create-new-page)

The create new page button at topbar when you press on it, the popup modal open with new page form, so fill page name and slug and if you need the page become a home page type slug / .

[![](./screenshots/screenshot_03.png)](./screenshots/screenshot_03.png)

After submit the form will receive toast notification that page has been created successfully, so select the new page throw select page input on the top bar to start modifying the page.

Don't forget to handle routes in routes/web.php , laravel grapes come with it own route file in page-builder.php

```
is_active) {
            return abort(404);
        }

        return view('website.pages.page')->with([
            'page' => $page,
        ]);
    }
```

create your own custom page view and use those to show page styles and html content

```
    {!! $page->styles !!}

    {!! $page->html !!}
```

Author
------

[](#author)

[![Mohamed Allam](https://github.com/allamo123.png?size=90)](https://github.com/allamo123)

[License](https://github.com/allamo123/laravel-grapes/blob/main/LICENSE)
------------------------------------------------------------------------

[](#license)

MIT © [Mohamed Allam ](https://github.com/allamo123)

###  Health Score

27

—

LowBetter than 49% of packages

Maintenance46

Moderate activity, may be stable

Popularity4

Limited adoption so far

Community8

Small or concentrated contributor base

Maturity43

Maturing project, gaining track record

 Bus Factor1

Top contributor holds 99.6% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

###  Release Activity

Cadence

Every ~183 days

Total

3

Last Release

420d ago

Major Versions

v1.0.0 → v2.0.02025-03-20

### Community

Maintainers

![](https://www.gravatar.com/avatar/b076170fd60f008024c628db78728517f2f60a3b70e9b2eda947526eea98465a?d=identicon)[MahmoudElsherbeny](/maintainers/MahmoudElsherbeny)

---

Top Contributors

[![allamo123](https://avatars.githubusercontent.com/u/55511778?v=4)](https://github.com/allamo123 "allamo123 (275 commits)")[![Sarthakj02](https://avatars.githubusercontent.com/u/108919895?v=4)](https://github.com/Sarthakj02 "Sarthakj02 (1 commits)")

### Embed Badge

![Health badge](/badges/mahmoudelsherbeny-laravel-grapes/health.svg)

```
[![Health](https://phpackages.com/badges/mahmoudelsherbeny-laravel-grapes/health.svg)](https://phpackages.com/packages/mahmoudelsherbeny-laravel-grapes)
```

###  Alternatives

[voku/html-min

HTML Compressor and Minifier

1804.7M39](/packages/voku-html-min)[wyrihaximus/html-compress

Compress/minify your HTML

841.6M31](/packages/wyrihaximus-html-compress)[based/momentum-trail

Fully typed frontend route helper for Laravel apps

80389.6k](/packages/based-momentum-trail)[msa/laravel-grapes

laravel grapes is a cms drag and drop page builder

1853.1k](/packages/msa-laravel-grapes)

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)
