{"id":13575627,"url":"https://github.com/LinkStackOrg/linkstack-themes","last_synced_at":"2025-04-04T22:31:40.915Z","repository":{"id":41513861,"uuid":"493599417","full_name":"LinkStackOrg/linkstack-themes","owner":"LinkStackOrg","description":"A list of themes for LinkStack. Customize the look of your LinkStack instance with themes. Themes allow you to change the look and feel of your site with a few clicks. Users can submit themes they created for everyone to download and use.","archived":false,"fork":false,"pushed_at":"2024-09-18T10:36:58.000Z","size":143,"stargazers_count":68,"open_issues_count":3,"forks_count":3,"subscribers_count":4,"default_branch":"main","last_synced_at":"2025-02-28T20:49:07.560Z","etag":null,"topics":["linkstack"],"latest_commit_sha":null,"homepage":"https://linkstack.org/themes","language":"HTML","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/LinkStackOrg.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2022-05-18T09:39:29.000Z","updated_at":"2025-02-27T13:54:54.000Z","dependencies_parsed_at":"2024-01-16T20:25:44.659Z","dependency_job_id":"77e8e5d5-7acb-4f9d-bc2d-bf323048b1bb","html_url":"https://github.com/LinkStackOrg/linkstack-themes","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/LinkStackOrg%2Flinkstack-themes","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/LinkStackOrg%2Flinkstack-themes/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/LinkStackOrg%2Flinkstack-themes/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/LinkStackOrg%2Flinkstack-themes/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/LinkStackOrg","download_url":"https://codeload.github.com/LinkStackOrg/linkstack-themes/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247260746,"owners_count":20910069,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["linkstack"],"created_at":"2024-08-01T15:01:02.722Z","updated_at":"2025-04-04T22:31:35.906Z","avatar_url":"https://github.com/LinkStackOrg.png","language":"HTML","readme":"\u003ch1\u003e🖌️ LinkStack Themes\u003c/h1\u003e\n\u003ch3\u003eLinkStack themes to customize your personal page.\u003c/h3\u003e\n\n⚠️ \u003cem\u003eNote that this page contains user generated content\u003c/em\u003e\n\n\u003cbr\u003e\n\n\u003ca href=\"https://linkstack.org/themes\"\u003e\u003cimg src=\"https://raw.githubusercontent.com/LinkStackOrg/branding/main/badges/png/download_themes.png\" alt=\"Download themes\" width=\"380\" \u003e\u003c/a\u003e\n\n\u0026ensp;\u0026ensp;\u0026ensp;\u003ca href=\"https://linkstackorg.github.io/linkstack-themes/\"\u003e\u003cins\u003eAlternative Site\u003c/ins\u003e\u003c/a\u003e\n\n\u003cbr\u003e\n\n\u003ch1\u003e🫂 Contribute\u003c/h1\u003e\n\u003ch3\u003eContribute by making your own custom themes.\u003c/h3\u003e\n\n1. [Fork the template repository](#1) -\u003e [LinkStackOrg/linkstack-default-theme](https://github.com/LinkStackOrg/linkstack-default-theme)\n2. [Edit the code](#2)\n3. [Draft a new release with a version tag](#3)\n4. [Open a new pull request or issue on this repository](#4)\n\n\u003cbr\u003e\n\n### Theme V2 update:\n\u003cdetails\u003e\n    \u003csummary\u003eRead more...\u003c/summary\u003e\n\nTheme V2 is the update to the theme system that allows theme-makers to make use of long awaited features.\n\n**These features include:**\n- Ability to disable custom styled buttons created by the button editor.\n- Ability to open links in the same tab\n- Ability to use custom code such as Blade, PHP, HTML, JS and CSS\n- Ability to use custom assets and files such as CSS, JS or image files\n- Ability to add custom icons\n- Ability to make use of other file types for the custom icons instead of being limited to SVGs\n\n\u003c/details\u003e\n\n\n#### File tree:\n\u003cpre\u003e\n.\n└── your-theme/\n    ├── animations.css\n    ├── brands.css\n    ├── config.php\n    ├── preview.png\n    ├── readme.md\n    ├── share.button.css\n    ├── skeleton-auto.css\n    └── extra/\n        ├── custom-body-end.blade.php\n        ├── custom-body.blade.php\n        └── custom-head.blade.php\n\t\t\t├── custom-assets/\n\t\t\t└── custom-icons/\n\u003c/pre\u003e\n\n\u003cbr\u003e\n\n\u003ca name=\"1\"\u003e\u003c/a\u003e\n## 1. Fork the template repository\nMake a fork of this [template repository](https://github.com/LinkStackOrg/linkstack-default-theme). Here you can find the theme files for the default theme.\n\n\u003cbr\u003e\n\n\u003ca name=\"2\"\u003e\u003c/a\u003e\n## 2. Edit the Code\n\n**Note:** Before committing your new theme to this theme repository, edit the readme.md to fit your created theme. Make sure to include all additional assets used to create your custom CSS.\n\nMake sure to include a preview image of your theme. This preview image should show both dark and light mode, if applicable. You may add custom text or descriptions to this image, just make it an adequate representation of your theme. Please keep this image in a `16:9` aspect ratio and don't scale it higher than `1920x1080p`. Make sure to use a PNG as the file type.\n\n\u003cbr\u003e\n\n### 2.1 Edit the CSS\n\nCustomize the files to fit your idea.\n\nDefault theme uses `prefers-color-scheme` to switch between dark and light mode. You can either keep this format and adjust the colors to your liking, or set one color theme for both modes.\n\n(for CSS only themes this is the only step you'll need.)\n\n\u003cbr\u003e\n\n### 2.2 Edit the config\n\nThe theme config allows you to configure how LittleLink Custom should treat your theme.\nAll settings are explained with comments in the config file.\n\nIf you edited your buttons in the previous step, your theme may not be compatible with custom buttons created by the Button Editor.\nYou can disable the use of custom buttons in the config.\n\nIf you want to use custom code like HTML, JavaScript or custom icons in your theme you can enable this here as well.\n\n\u003cbr\u003e\n\n### 2.3 Adding custom code\n\nThe new theme system allows you to inject custom code at three places on your page: in the head, body and at the end of the body tag.\n\nYou can add your custom code with 3 individual files in the \"extra\" folder with the files:\n\n\u003cpre\u003e\ncustom-body-end.blade.php\ncustom-body.blade.php\ncustom-head.blade.php\n\u003c/pre\u003e\n\nHere you can write your code in the following languages: Blade, PHP, HTML, JS and CSS.\n\nFurther instructions are provided in the individual files as comments.\n\n\u003cbr\u003e\n\n### 2.4 Adding custom assets\n\nThe theme system gives you the option to add custom assets to your page.\n\nYou will have to declare these additions in the file custom-head.blade.php (others work too if required).\n\nCustom assets are stored in the 'custom-assets' directory found inside the 'extra' folder.\nCustom assets can be any file you would like to use in your theme.\nFor example: JS, CSS or image files.\n\nYou can load these custom assets with a built-in function, 'themeAsset()'.\nAdd the file you want to add to your 'custom-assets' folder, and include the name with the file extension in the function.\n\n\nFor this the file and custom code have to be enabled in the config.php\n\n\u003cdetails\u003e\n\u003cpre\u003e\n\nDown below, you can find a few examples using this function:\n\n\u003clink rel=\"stylesheet\" href=\"{{themeAsset('your.css')}}\"\u003e\n\u003cscript src=\"{{themeAsset('your.js')}}\"\u003e\u003c/script\u003e\n\u003cstyle\u003ebody{background-image: url({{themeAsset('your.png')}});}\u003c/style\u003e\n\n\u003c/pre\u003e\n\u003c/details\u003e\n\n\u003cbr\u003e\n\n### 2.5 Add custom icons\n\nYou can download all the icons used for the buttons from [here](https://download-directory.github.io/?url=https%3A%2F%2Fgithub.com%2FLinkStackOrg%2FLinkSTack%2Ftree%2Fmain%2Flittlelink%2Ficons).\n\nFor custom icons to apply you have to enable them in the config first.\n\nInclude your edited icons in the \"custom-icons\" folder while keeping the original file names.\n\nYou can use other file types like PNG, JPG, etc. by defining a custom file extension in the config.\n\n\u003cbr\u003e\n\n\u003ca name=\"3\"\u003e\u003c/a\u003e\n## 3. Draft a new release with a version tag\nCreate a new release for your theme in your forked repository. The download URL for that release will later be used to download the font. Create a new tag for your new release. Your first tag should always be v1.0.\n\n**Note:** Please keep the final release file below 2 Megabyte to insure maximum compatibility. For this, it is recommended to compress any images used. This can easily be done online on a site like [tinypng.com](https://tinypng.com).\n\n\u003cbr\u003e\n\n\u003ca name=\"4\"\u003e\u003c/a\u003e\n## 4. Open a new pull request or issue on this repository\nOnce you followed all these steps, you may [open a pull request or issue](https://github.com/LinkStackOrg/linkstack-themes) on this repository to get included in the official theme list.\n\n\u003cbr\u003e\n\n### [For any questions and easier communications, make sure to join our discord community](https://discord.linkstack.org)\n","funding_links":[],"categories":["HTML"],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FLinkStackOrg%2Flinkstack-themes","html_url":"https://awesome.ecosyste.ms/projects/github.com%2FLinkStackOrg%2Flinkstack-themes","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FLinkStackOrg%2Flinkstack-themes/lists"}