{"id":27408128,"url":"https://github.com/jasontheadams/bbcustomattributes","last_synced_at":"2025-04-14T07:19:05.403Z","repository":{"id":72853476,"uuid":"169495162","full_name":"JasonTheAdams/BBCustomAttributes","owner":"JasonTheAdams","description":"Provides the ability to add custom attributes to any Beaver Builder module","archived":false,"fork":false,"pushed_at":"2024-09-14T18:25:24.000Z","size":32,"stargazers_count":23,"open_issues_count":1,"forks_count":4,"subscribers_count":4,"default_branch":"master","last_synced_at":"2025-04-14T07:18:59.819Z","etag":null,"topics":["beaver-builder","wordpress","wordpress-plugin"],"latest_commit_sha":null,"homepage":null,"language":"PHP","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/JasonTheAdams.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"license.txt","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":"2019-02-06T23:53:53.000Z","updated_at":"2025-02-14T18:09:46.000Z","dependencies_parsed_at":"2024-08-22T17:43:54.318Z","dependency_job_id":"ea28b7e8-3d02-4811-a10b-0696ba778ce8","html_url":"https://github.com/JasonTheAdams/BBCustomAttributes","commit_stats":null,"previous_names":[],"tags_count":4,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/JasonTheAdams%2FBBCustomAttributes","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/JasonTheAdams%2FBBCustomAttributes/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/JasonTheAdams%2FBBCustomAttributes/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/JasonTheAdams%2FBBCustomAttributes/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/JasonTheAdams","download_url":"https://codeload.github.com/JasonTheAdams/BBCustomAttributes/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248837195,"owners_count":21169374,"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":["beaver-builder","wordpress","wordpress-plugin"],"created_at":"2025-04-14T07:19:04.747Z","updated_at":"2025-04-14T07:19:05.373Z","avatar_url":"https://github.com/JasonTheAdams.png","language":"PHP","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Beaver Builder Custom Attributes\n\n## What does this do?\nIt adds the ability to add custom attributes to modules, columns, and rows within Beaver Builder the same way you would add\na class or ID. In fact, you'll find the new field right below those fields in the Advanced tab.\n\n## How does it work?\nAfter installing, to add an attribute to modules, columns, and rows, you navigate to the advanced tab. There will now be a field below the Label input where you can add your attributes.\nWhen you click into a custom attribute, you will have inputs for Key, Value, Target Selector, and Override Attribute.\n- The **Key** and **Value** inputs are your attribute name/value pairs like: `key=\"value\"`\n- The **Target Selector** is a way to add your custom attribute to an inner element of the current element. By default, all attributes are added to the outer wrapper of a module/column/row. For example, you could add an attribute like `id`, `class`, `title` or an `aria-` attribute to an `\u003ca\u003e` inside a Button Module by typing in a Target Selector of `a` or `a.fl-button`. See below for more info about this feature.\n- The **Override Attribute** select input allows you to override the attribute if that attribute already exists from another source. Selecting 'No' is safer and will avoid conflicts.\n\n![custom-attribute-form](https://github.com/user-attachments/assets/9f60dea4-c149-4533-8c52-10c1c6227fe5)\n\n## Advanced use of the Target Selector\nThe Target Selector allows you to apply custom attributes to inner elements within the current element. Here are some advanced usage tips:\n- If your Target Selector matches more than one inner element, all matches will receive the attribute.\n- These inner attributes are added with JavaScript, so if you are trying to access this data with your own JavaScript, you will need to make sure it runs after this JavaScript runs.\n### Ensuring custom JavaScript runs after attributes are applied\nThe JavaScript to add the inner element attributes runs on `DOMContentLoaded` in the footer. So if you need to run JavaScript on those attributes, to ensure it runs after the custom attributes have been applied, you can listen for the `customAttrsProcessed` event. Additionally, you should check if the processing has already completed by checking the `window.customAttrsProcessingComplete` flag. Here is an example:\n```\nfunction runCustomJs() {\n    // Your custom JavaScript here\n}\n\nif (window.customAttrsProcessingComplete) {\n    // If the custom attributes processing is already complete\n    runCustomJs();\n} else {\n    // Otherwise, wait for the customAttrsProcessed event\n    document.addEventListener('customAttrsProcessed', runCustomJs);\n}\n```\n\n## How do I install it? What about updates?\n1. Download the zip file of this plugin\n2. Upload it to your WordPress install\n3. Activate the plugin.\n\n### How Updates Work\n\nEven though the plugin is not listed in the WordPress repository, you’ll still receive updates through the WordPress dashboard like any other plugin. The GitHub updater built into the plugin ensures that whenever there’s a new version available on GitHub, it will appear in your WordPress updates section.\n\nThis means you don’t have to manually check GitHub for updates—the plugin will notify you of new releases and allow you to update in one click, just like with plugins from the WordPress plugin repository.\n\n## Is this supported?\nThis is intended to be a very simple and light-weight plugin. Ideally it shouldn't really require much support.\nThat said, if you create an issue or pull request I'll get to it when I'm able. Please don't expect too much as this\nis just a freebie intended to help others.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjasontheadams%2Fbbcustomattributes","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fjasontheadams%2Fbbcustomattributes","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjasontheadams%2Fbbcustomattributes/lists"}