Unfortunately, the way social media sites get the title, description, and URL of a page is by reading meta tags that have to be hardcoded in the html of the page and cannot be dynamically inserted when the app loads like the rest of the content of your story (cover image, title text, etc.). Because of this, the only way to make these changes is to download the source code and change the content of these meta tags. We have a blog post about it here: https://developerscorner.storymaps.arcgis.com/grow-your-story-maps-audience-with-open-graph-tags-b76....
Because you are embedding the story, you should actually place these open graph tags in your html of the parent page embedding your app. Then use the "og:url" open graph tag (The Open Graph protocol) with the content set to the URL of that parent webpage.
The Facebook share is getting the "Error: Item does not exist or is inaccessible" because you tried sharing the link on Facebook before you made the story public. Facebook caches this result to make their service more efficient. You can tell Facebook to refresh their cache at any time by going to this page: https://developers.facebook.com/tools/debug/og/object/, enter the URL in the input, and click "Fetch new scrape information".
The story map crowdsource app is a responsive app so when you embed it at a 640x480 px resolution, you are actually getting the same version a viewer would see on their smartphone. Because at this size, the title and subtitle usually fill most of the available cover screen, we have also extended the title background to fill the whole image. This helps keeps the text readably even to viewers with vision impairments. If you do need to change this, when you download the source code, you will find a place to enter custom CSS at the top of the body in the index.html.
). Also could you share a link to your story map if it is shared publicly?