# Export Components

**URL:** <https://forum.pinegrow.com/t/export-components/3359>\
**Category:** Third Party Plugins\
**Tags:** feature-request, tutorial\
**Created:** [September 18, 2019, 11:31am UTC](https://forum.pinegrow.com/t/export-components/3359 "2019-09-18T11:31:37Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![ArthurOliv](https://avatars.discourse-cdn.com/v4/letter/a/bb73d2/32.png) [@ArthurOliv](https://forum.pinegrow.com/u/ArthurOliv)\
**Post date:** [September 18, 2019, 11:31am UTC](https://forum.pinegrow.com/t/export-components/3359/1 "2019-09-18T11:31:38Z")

</div>

Hi, I’m currently using Bootstrap Studio, and there is possible to create a component and export it as a component file, with bss extention, so I can only click on it and it will be add to my library, carryng css, scss and js files. I’m trying to do this in Pinegrow, but it doens’t work, I saved as a Html snippet and save the library, it generates a Js file, but when I import in another computer, it only carry the HTML, theres any way I can generate a file, or even a package, that carry all the css, js, scss I need?

---

<div class="post-metadata">

**Author:** ![Marf](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/marf/32/1799_2.png) [@Marf](https://forum.pinegrow.com/u/Marf)\
**Post date:** [September 18, 2019, 2:45pm UTC](https://forum.pinegrow.com/t/export-components/3359/2 "2019-09-18T14:45:11Z")

</div>

Hi Arthur welcome to the Pinegrow Forum.

I guess it must be possible. See in the “Top Menu”, the section **“Components”** and **“Edit Resources”**.  
There you have the option to add the resources you need/want (CSS/JS/Images, etc).

Or select from the “Project Panel”, right mouse click on a file and choose **“Components - Add to resources”**.

I assume that those files are added to the “Library JS file”, but if it are only references to those file locations then they are going to point to nowhere when you transfer and import only the “Library JS file” on another computer.

* * *

See also this old(er) documentation page (there is no updated docs about this feature for current version), it’s for v2, but the pricipal is still the same for a library with components. Maybe this gives you a better insight how this feature is working in Pinegrow. Look also at section “Component library resources”.

> **[Libraries - Pinegrow Web Editor - Documentation and Tutorials](http://docsbeta.pinegrow.com/libraries/)**
>
> Every project can be loaded as a library of another project. That means that all the components and resources defined in the library project will become available for use in the current project. That's a powerful way of defining reusable website...

* * *

The user @benhanna is having a site with plugins and templates for Pinegrow.  
Those templates are actually libraries with Components and are bundled with custom CSS/JS and images. So it seems it must be possible to make a library with those components which you can export and import and maintain the needed resources.

> **[Plugins For Pinegrow | Free & Premium Pinegrow Plugins & Templates](https://pluginsforpinegrow.com/)**
>
> Free & Premium Pinegrow Plugins. Download Our Pinegrow Templates, Plugins, Block Kits and Add on's or view our Pinegrow tutorials. All our Pinegrow plugins are easy to install and use and work with the latest version of Pinegrow web Editor.

Maybe @benhanna can tell and explain more/better how this is exactly working!  
(Sorry Ben, I hope you don’t mind I tagged you).

---

<div class="post-metadata">

**Author:** ![ArthurOliv](https://avatars.discourse-cdn.com/v4/letter/a/bb73d2/32.png) [@ArthurOliv](https://forum.pinegrow.com/u/ArthurOliv)\
**Post date:** [September 18, 2019, 4:09pm UTC](https://forum.pinegrow.com/t/export-components/3359/3 "2019-09-18T16:09:46Z")

</div>

Hi @Marf thanks for the welcome and thanks so much for the answer, I already been successfull creating the component, but it still saved without the files I need, but with your answer I have an Idea of how can I achieve this. I’ll try here and post a reply as soon as I can!

Thanks so much again!

---

<div class="post-metadata">

**Author:** ![Marf](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/marf/32/1799_2.png) [@Marf](https://forum.pinegrow.com/u/Marf)\
**Post date:** [September 18, 2019, 5:18pm UTC](https://forum.pinegrow.com/t/export-components/3359/4 "2019-09-18T17:18:35Z")

</div>

@ArthurOliv Btw there are a few free block packs available on the site I mentioned, you can download them to see how they are constructed and build. And see how the resources are added / bundled / configured. Maybe it can help you to understand and find some clues how you can achieve to add the resources (the best way).

> **[80 Free Pinegrow Blocks - Plugins For Pinegrow | Free Component Library](https://pluginsforpinegrow.com/80-free-pinegrow-blocks/)**
>
> 80 Free Pinegrow Blocks that load as a component library in Pinegrow. Simply download, open as a project and all the Pinegrow blocks will appear in the list

> **[50 Free Bootstrap 4 Blocks For Pinegrow - Plugins For Pinegrow](https://pluginsforpinegrow.com/50-free-bootstrap-4-blocks-for-pinegrow/)**
>
> 50 Free Blocks Bootstrap 4 Blocks for Pinegrow. This is the free version of our best selling Plugin and features 50 free Bootstrap 4 Blocks for Pinegrow

> **[33 Free Pinegrow Bootstrap Blocks - Plugins For Pinegrow](https://pluginsforpinegrow.com/33-free-pinegrow-bootstrap-blocks/)**
>
> 33 Free Pinegrow Bootstrap Blocks.  Includes a nice slide out menu. Open the folder as a project and all the blocks will appear for you to use.

---

<div class="post-metadata">

**Author:** ![ArthurOliv](https://avatars.discourse-cdn.com/v4/letter/a/bb73d2/32.png) [@ArthurOliv](https://forum.pinegrow.com/u/ArthurOliv)\
**Post date:** [September 18, 2019, 6:41pm UTC](https://forum.pinegrow.com/t/export-components/3359/5 "2019-09-18T18:41:17Z")

</div>

@Marf I tried doing this, I generate the component in Components/Define Comp. Then I create an empty folder, add as a project folder and import the component I created, by going to manage frameworks and plugins, so far it goes perfect. When I drag the component to the page, the js, images and css are imported to the project folders, but the path it’s wrong, so those files can’t be found. The same happen when I import one of the libraries you send me!  
Maybe there’s some kind of bug with the software. I’m using the 7 days try out license. I’ll try to install again!

Thanks so much.

---

<div class="post-metadata">

**Author:** ![Marf](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/marf/32/1799_2.png) [@Marf](https://forum.pinegrow.com/u/Marf)\
**Post date:** [September 18, 2019, 7:53pm UTC](https://forum.pinegrow.com/t/export-components/3359/6 "2019-09-18T19:53:06Z")

</div>

> [@ArthurOliv](#):
>
> Maybe there’s some kind of bug with the software.

@ArthurOliv I found the following, maybe it’s related to the issues you described with **“wrong paths”**.

> [@Pinegrow version 5.7 breaks all links on pages that uses a master](https://forum.pinegrow.com/t/pinegrow-version-5-7-breaks-all-links-on-pages-that-uses-a-master/3247):
>
> Hello, I’m aware that the something changed in the master pages’ url mapping in version 5.7. Sadly, the new version breaks all the links that were perfectly mapped so far, when ‘Update the whole project’ is run. The bug consistently appears in all my Pinegrow projects, that – by the way – has a conventional/nothing special folder structure. Has anyone else experienced this? The issue apply to both \<img\> and \<link\> tags. So far I’ve used only relative urls on the master pages, which were perfec…

You could install the prior version Pinegrow **v5.6** (you can use the same trial license to activate) and see if it would work with that version.

> **[Download | Pinegrow Web Editor](https://docs.pinegrow.com/download/)**
>
> Download current and older versions of our applications.

* * *

Maybe @Emmanuel or @matjaz can confirm these issues with Pinegrow v5.7, and tell you more about when a fix will be released.

---

<div class="post-metadata">

**Author:** ![Marf](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/marf/32/1799_2.png) [@Marf](https://forum.pinegrow.com/u/Marf)\
**Post date:** [September 19, 2019, 7:40am UTC](https://forum.pinegrow.com/t/export-components/3359/7 "2019-09-19T07:40:26Z")

</div>

> [@Pinegrow version 5.7 breaks all links on pages that uses a master](https://forum.pinegrow.com/t/pinegrow-version-5-7-breaks-all-links-on-pages-that-uses-a-master/3247/3):
>
> Hi @martonlente, 5.7 doesn’t correctly resolve urls that contain …/… (up two levels or more). This will be fixed in the next update, out soon. I also added some logging information to see if there is also an issue with url mapping on Windows. Thanks for letting us know about the issue.

---

<div class="post-metadata">

**Author:** ![ArthurOliv](https://avatars.discourse-cdn.com/v4/letter/a/bb73d2/32.png) [@ArthurOliv](https://forum.pinegrow.com/u/ArthurOliv)\
**Post date:** [September 19, 2019, 11:01am UTC](https://forum.pinegrow.com/t/export-components/3359/8 "2019-09-19T11:01:50Z")

</div>

@Marf Thanks so much again for the help! I’ll try to use the 5.6 version, and see if works!  
I guess soon they must fixed that problem.

---

<div class="post-metadata">

**Author:** ![Marf](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/marf/32/1799_2.png) [@Marf](https://forum.pinegrow.com/u/Marf)\
**Post date:** [September 19, 2019, 5:53pm UTC](https://forum.pinegrow.com/t/export-components/3359/9 "2019-09-19T17:53:06Z")

</div>

> [@ArthurOliv](#):
>
> I’m using the 7 days try out license.

> [@ArthurOliv](#):
>
> I’ll try to use the 5.6 version, and see if works!

You lost/spend some time because of the current problems with the url paths. If needed you can email Pinegrow support (they are nice people), and they can extend your trial period a bit longer, when you want/need some more time to explore Pinegrow.
