I am making a readme file for my GitHub project and need to link to a specific bullet point within a specific section in the readme file. Is this possible?
Not directly in Markdown, but you can use an HTML list and add an id to whatever item you want to link to:
<ul>
<li>Foo</li>
<li id="bar">Bar</li>
</ul>
Then, you can link to it using that id, e.g.
[Link to Bar](#bar)
Link to Bar
Or from another document:
[Link to Bar](https://github.com/bj97301/project/blob/main/README.md#bar)
Related
I am quite new to TYPO3 and i am trying to build something which i am not sure how to do!
I have installed the T3G/blog extension.
On my website i have a "Blog" page, where i would like to show the blog posts like this (for each post):
Post Title
Post Date
Full Post Content
Post Author
I imagine i have to use a for loop to go through the blog posts available, but i can't find a way to make it work.
Right now i have something like this:
<div class="blog__content__left">
<f:debug>{_all}</f:debug>
<div class="blog__post__title"></div>
<div class="blog__post__date"></div>
<div class="blog__post__content"></div>
<div class="blog__post__author"></div>
</div>
The output of the debug is an array with my posts, but now my question is:
how can i render the right information on the right place?
Thank you!
You have to loop through all posts of a blog.
<f:for each="{blog.posts}" as="post">
<h2>{post.title}</h2>
<p>{post.content}</p>
</f:for>
There are so many tutorials about blog. Have a look at https://docs.typo3.org/typo3cms/ExtbaseFluidBook/3-BlogExample/Index.html
Debug
When you see the output in your debug, you can use the information in your template. Say your debug output sais the following:
- Blog
> Headline
> Text
You can call these items in your template as {blog.headline} (for example).
Using original files as base for your own template
I suggest taking a look at the default templates provided. You can find these template in your typo3/typo3conf/ext/{extension}/Resources/Private Folder.
Take a look at the tags being used! You can use these in your template.
You should download the Layouts, Partials and Template folder, and upload these in your fileadmin/{blogmodule}/ folder. Set the path in TypoScript, You'll probably find an example in the plugin documentation.
So I've spent a day on Google, and trying bits of jquery/javascript to do what I'm looking to do and am officially stuck.
I'm building a site using Squarespace, with the Marquee theme applied. I would like to be able to add a custom link in the primary navigation to send users to an alternative language version of each specific page.
But, I'm struggling. Ive found solutions on here that should work, but I don't think I'm applying it right. Ive tried adding a single link to the navigation and using a script on each page (in the code injection point of the head section) point that link somewhere else.
This would mean I have a single link in the navigation (which is standard across the site) pointing users to whichever page I want...on a per page basis. I know there is a solution out there....just can't make it work!
The section I need the link to work from is:
<div id="desktopNav" data-content-field="navigation-mainNav" data-annotation-alignment="bottom left">
<nav class="main-nav" id="yui_3_17_2_1_1450478013910_660">
<div class="nav-wrapper" id="yui_3_17_2_1_1450478013910_659">
<ul class="cf" id="yui_3_17_2_1_1450478013910_658">
<li class="page-collection">
<span>Menu</span>
</li>
</ul>
</div>
</nav>
</div>
None of this can be edited directly though...
I was thinking something like this could work, but I cant work out how to apply it to my situation...
Change href value for a hyperlink
Any help, gratefully received!
I fixed it...using this:
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('a[href*="original.site"]').attr('href', 'http://website.com');
});
</script>
It allows me to point a single link in the navigation (which cant be edited directly) to whatever I want it to go to.
My backend (RTE) shows me:
<p> <b>Header</b> Some text Link </p>
But when I open my frontend in the browser and check the source code I get this:
<b>Header</b> Some Text Link
So I thought that maybe some html tags get deleted or not stored in the database. But when I reopen it in the backend (RTE):
<p> <b>Header</b> Some text Link </p>
The tags are still there. So they only won't be displayed in the frontend.
How can I show the original code in the frontend?
maybe the target of the link is not reachable?
TYPO3 checks links and if they are not accessable, it doesn't render the link.
I am trying to create a Facebook share option for my blog articles, and it works but it doesn't take the article text or image, but the first image and text on the (single page) website. How can I change my share code so that it will use the article's image and text from where I click the FB share button?
This is the template for the blog article, with the FB share code included:
<div class="contentLeft">
<div class="roundimage">
<a href="[[+roundImage:phpthumbof=`h=750&zc=1`]]" class="colorbox" title="[[+roundImageCaption]]"><img class="round"
src="[[+roundImage:phpthumbof=`w=170&h=170&zc=1&q=95`]]" alt="[[+roundImageCaption]]" /></a>
</div>
<script type="text/javascript">function fbs_click() {u=location.href;t=document.title;window.open('http://www.facebook.com/sharer.php?u='+encodeURIComponent(u)+'&t='+encodeURIComponent(t),'sharer','toolbar=0,status=0,width=626,height=436');return false;}</script>
<h4 class="blue" style="margin-bottom:10px; margin-top:0;">[[+articleHeadline]]</h4>
<p class="datetext">[[+datetimeText]]</p>
<p class="readmoretext">[[+articleText]]</p>
<div class="divider"></div>
</div>
I hope you can help! Thank you!
It should be enough to make sure that the article page, ie the link that you are sharing, embeds the correct og:image and og:description. You only share the link with the share button, and facebook will embed the link and look in it for the proper data.
Update:
I guess you're not using the articles package to create the blog? If you are you already have individual pages even if you're not using them =) If you're not i assume you're using some sort of resource loop to create your entries.
After looking around in the facebook docs it seems you can specify the image (https://developers.facebook.com/docs/opengraph/using-actions/v2.0#params) when creating your share button using the javascript sdk (https://developers.facebook.com/docs/sharing/reference/share-dialog). Each article will need to call something like this instead of the current javascript share url functionality.
FB.ui({
method: 'share_open_graph',
action_type: 'og.likes',
action_properties: JSON.stringify({
image: "YourImageForThisRespectiveShare",
})
}, function(response){});
If you prefer to explore the method i mentioned in the comments it would go something like this:
Look in your code at u=location.href;, you'd want to try modifying that to u=location.href+'?articleid=[~[*id*]~]';. When you share you should hopefully see the appended article ID for each article.
You'll then need to make sure you can specify og:image and description for each article, i assume you somehow have resources set up that represent each article, in that case just create a couple of template variables for that resource type.
In your header you could then use the getResourceField package for example to retrieve the correct TV from the correct resource, as specified by the ?articleid= parameter in your URL.
To retrieve the parameter you'll need a simple snippet like return (!empty($_GET['articleid']) ? $_GET['articleid'] : $default);. Lets name the snippet: "getArticleId". I left the option to decide a default image when there is no &articleid specified.
You're using modx evolution from the look of your [~[*id*]~] tag, but there should be some equivalent of the getResourceField package for evolution. This is the revolution version of the code needed:
<meta property="og:image" content="[[!getResourceField?
&id=`[[!getArticleId? &default=`[[*id]]`]]` //Take the blog page's own image as a default
&field=`imageTV` //you'll of course have to change "imageTV" to whatever you call it
&isTV=`1`
]]" />
Repeat for og:title and og:description, with their respective TV names.
I am trying out the following example. ChangeTextOnClick.html works fine as it is in the same dir as the file that contains the following snippet (WicketLink.html). But HelloWorld.html does not work as it is in another package. How do i refer to page on a different package.
<wicket:link>
<ul>
<li>
Change Text On Click
Back
</li>
</ul>
</wicket:link>
my pages are in the follow dir structure
com.merc.wicket.link.WicketLink.java and .html
com.merc.wicket.link.ChangeTextOnClick.java and .html
com.merc.wicket.main.HelloWorld.java and .html
In Wicket, you would normally reference another html file using a Link in Java to let Wicket generate the href for you. You can mount a Page under a fix URL (called Bookmarkable Link, as they are independent from the user session) or just use a Link.
For a Bookmarkable Link, you would do the following in the init() of your Wicket application class:
public class WicketApplication extends WebApplication{
protected void init() {
super.init();
mountBookmarkablePage("/ChangeTextOnClick", ChangeTextOnClick.class);
mountBookmarkablePage("/HelloWorld", HelloWorld.class);
}
}
With this, you can always reach those 2 Pages under the the URL given.
You can create a link pointing there using this in a MyPage.java:
add(new BookmarkablePageLink<ChangeTextOnClick>("myExampleLink"
,ChangeTextOnClick.class)
and in the corresponding MyPage.html:
<a href="thisGetsReplacedAtRuntime"
wicket:id="myExampleLink">Change Text On Click</a>
If you don 't want the Links to be bookmarkable, you don 't need the mountBookmarkablePage stuff in the init() and use a a Link instead of a BookmarkablePageLink.
Have a look at the Wicket wicki, you will find lots of helpful information there.
It turns out my guess was correct so here it is as an answer:
Wicket uses / as path separator, not ..
<wicket:link>
<ul>
<li>
Change Text On Click
Back
</li>
</ul>
</wicket:link>
is one solution, or using relative paths:
<wicket:link>
<ul>
<li>
Change Text On Click
Back
</li>
</ul>
</wicket:link>
The above answer is perfect.It need not only to be in the different folder in the project,but also it can be anywhere in the folder in the system.Still it possible to refer that file,if the configuation is done correctly in WicketApplication file.