diff --git a/apps/frontend/src/components/layout/settings.component.tsx b/apps/frontend/src/components/layout/settings.component.tsx
index 759abb20..80db3e39 100644
--- a/apps/frontend/src/components/layout/settings.component.tsx
+++ b/apps/frontend/src/components/layout/settings.component.tsx
@@ -196,7 +196,7 @@ export const SettingsPopup: FC<{ getRef?: Ref<any> }> = (props) => {
             </div>
           )}
           {!!user?.tier?.team_members && isGeneral && <TeamsComponent />}
-          {!!user?.tier?.public_api && isGeneral && <PublicComponent />}
+          {!!user?.tier?.public_api && isGeneral && showLogout && <PublicComponent />}
           {showLogout && <LogoutComponent />}
         </div>
       </form>
diff --git a/apps/frontend/src/components/public-api/public.component.tsx b/apps/frontend/src/components/public-api/public.component.tsx
index 087c4b87..1f211c3a 100644
--- a/apps/frontend/src/components/public-api/public.component.tsx
+++ b/apps/frontend/src/components/public-api/public.component.tsx
@@ -25,6 +25,14 @@ export const PublicComponent = () => {
       <h2 className="text-[24px]">Public API</h2>
       <div className="text-customColor18 mt-[4px]">
         Use Postiz API to integrate with your tools.
+        <br />
+        <a
+          className="underline hover:text-white"
+          href="https://docs.postiz.com/public-api"
+          target="_blank"
+        >
+          Read how to use it over the documentation.
+        </a>
       </div>
       <div className="my-[16px] mt-[16px] bg-sixth border-fifth items-center border rounded-[4px] p-[24px] flex gap-[24px]">
         <div className="flex items-center">